JSFiddle - React, Tailwind, and code Playground

HTML

<ul id="move">
  <li>one</li>
  <li>two</li>
  <li>three</li>
  <li>four</li>
  <li>five</li>
  <li>six</li>
</ul>

CSS

ul#move
{
    position:relative;
    width:300px;
    border:solid;
    font-size:12px;
}
ul#move li
{
    list-style:none;
    margin:10px 0 0 0;
}

JavaScript

function cycle() {
    var lis = $('ul#move li')
    var l = lis.length - 1;
    var j = 0, t = 0;
    var step = 30;
    lis.each(function(index) {
       if(j ==1) {
          j = 0;
          t = 0;
       } else { 
          j++;
          t += step;
       }
       $(this).css('top',t+ 'px');
    });

}