JSFiddle - React, Tailwind, and code Playground

HTML

<button id="btn">
    Hover to move
</button>
<div id="box"></div>

CSS

#box {
    position: relative;
    top: 20px;
    left: 10px;
    width: 50px;
    height: 50px;
    background:#333366;
}

JavaScript

var value = 0,
        timer,
        btn = document.getElementById('btn');
        
    btn.onmouseover = function(){
        timer = setInterval(function(){
            //    your loop code here
            Move('box');
        }, 50);
    };
    
    btn.onmouseout = function(){
        clearInterval(timer);
    }
    
    function Move(element) {
    
        value += 10;
        var box = document.getElementById(element);
        box.style.transition = "left 0.2s ease-in-out 0s";
        box.style.left = value + 'px';
    
    }