JSFiddle - React, Tailwind, and code Playground

HTML

<ul id="scroll">
    <li>First.</li>
    <li>Second.</li>
    <li>Third.</li>
    <li>Fourth.</li>
</ul>

CSS

#scroll { overflow: hidden; }

#scroll > li { height: 20px; }

JavaScript

var scroll = function(){
    var first  = $("#scroll > li:eq(0)");
    var last = first.clone().appendTo("#scroll");
    
    $("#scroll").animate({ "scrollTop": first.outerHeight()  }, 500, function(){
        first.remove();
    });
    
    window.setTimeout(scroll, 1000);
};

$("#scroll").css({ height: $("#scroll").outerHeight() });

scroll();