JSFiddle - React, Tailwind, and code Playground

HTML

<!doctype html>
    <head>
        <meta charset="utf-8">
        <title>Insert title here</title>
    </head>
    <body>
        <div id="outer">
            <div id="inner">test box</div>
        </div>
    </body>
</html>

CSS

body {
    margin: 0;
}
#outer {
    width:100%;
    height: 100px; 
    background: red;
    position: relative
}
#inner {
    position: absolute;
    left: 0;
    right: 0; 
    background: green;
}

JavaScript

$('#inner').animate(
{
    left: '-=100%',
    right: '+=100%'
},
function() {
    $('#inner').delay(2000).animate(
        {
            left: '+=100%',
            right: '-=100%'
        }
    );
}
);