I am trying to create a loop using Javascript

Example:

1. list 1
2. list 2
3. list 3
4. list 4
5. list 5

I used this code:

$(document).ready(function() {
  var j = 0;
  var delay = 3000; // millisecond delay between cycles

  function cycleThru(cycles = Infinity) {
    if (cycles <= 0) return; // stop if `n` reaches 0

    var jmax = $("ul#cyclelist li").length - 1; // you could move this out of the function
    $("ul#cyclelist li:eq(" + j + ")")
      .animate({"opacity" : "1"} ,400)
      .animate({"opacity" : "1"}, delay)
      .animate({"opacity" : "0"}, 400, function() {
        (j == jmax) ? j=0 : j++; // or: j = (j + 1) % jmax
        cycleThru(cycles - 1);
      });
  };

  cycleThru(20);
});
  
}

but after list 1 disappear, the position of list 2 still on bottom of list 1.

How to move the position of list 2 up (replace the position of list 1 after list 1 disappear) ?

Thank you