JSFiddle - React, Tailwind, and code Playground

HTML

<div class="container">
    <div class="box">Content 1</div>
    <div class="box">Content 2</div>
    <div class="box">Content 3</div>
    <div class="box">Content 4</div>
    <div class="box">Content 5</div>
</div>

JavaScript

$(function() {
    $('.container .box').css('position', 'absolute').filter(':not(:first)').hide();
    $('.container .box:first').addClass('shown');
    
    setInterval(transition, 4000);
});

function transition() {
    var current = $('.shown');
    var next = null;
    if (current.next('.box').size() == 0) {
        next = $('.container .box:first');
    } else {
        next = current.next('.box');
    }
    current.fadeOut().removeClass('shown');
    next.fadeIn().addClass('shown');
}