JSFiddle - React, Tailwind, and code Playground

HTML

<button>Animate!</button>

<svg>
<rect id="rect1" x="0" y="0" width="100" height="50">
</svg>

JavaScript

function animate($el, attrs, speed) {
        speed = speed || 400;
        var start = {},
            timeout = 20,
            steps = Math.floor(speed/timeout),
            cycles = steps;
        
        $.each(attrs, function(k,v) {
            start[k] = $el.attr(k);
        });
        
        (function loop() {
            $.each(attrs, function(k,v) {
                var pst = (v - start[k])/steps;
                $el.attr(k, function(i, old) {
                    return +old + pst;
                });
            });
          if ( --cycles )
              setTimeout(loop, timeout);
          else
              $el.attr(attrs);
        })();
    }
    $('button').on('click', function() {       
        animate($('#rect1'), {x:99,y:299,width:50,height:100}, 2000);
    });