JSFiddle - React, Tailwind, and code Playground

HTML

<span id="box">&nbsp;</span>
<p><span id="plus">+</span>&nbsp;&nbsp;<span id="minus">-</span></p>

CSS

#box{
    height:80px;
    width:80px;
    border:2px solid black;
    background-color:red;
    display:block;
    -moz-transition: all 0.3s ease-out;  /* FF4+ */
    -o-transition: all 0.3s ease-out;  /* Opera 10.5+ */
    -webkit-transition: all 0.3s ease-out;  /* Saf3.2+, Chrome */
    -ms-transition: all 0.3s ease-out;  /* IE10 */
    transition: all 0.3s ease-out;  
}

JavaScript

$('#plus').click(function() {
    var mleft = $("#box").css("margin-left");
    var newleft = mleft.substr(0, mleft.length-2) + 50;
    $('#box').css("margin-left", newleft+"px");
});
$('#minus').click(function() {
    var mleft = $("#box").css("margin-left");
    var newleft = mleft.substr(0, mleft.length-2) - 50;
    $('#box').css("margin-left", newleft+"px");
});