JSFiddle - React, Tailwind, and code Playground

HTML

<html>
<body>
    
<div class="obj">1</div>  
<div style="display:none;" class="obj">2</div>  
<div style="display:none;" class="obj">3</div>  
  
</body>  
</html>

JavaScript

var i=1;  
  
    function show(id) {  
        $('.obj:visible').fadeOut('500',function () {  
            $($('.obj')[id-1]).fadeIn('500');  
        });  
    }  
  
    function next(start) {  
        if (!start) i++;  
        if (i>$('.obj').length) i=1;  
        show(i);  
        timeoutID = setTimeout(function(){next(0);}, 1000);  
    }  
  
    $(document).ready(next(1));