JSFiddle - React, Tailwind, and code Playground

HTML

<div id="step_1">this is step 1</div>
<div id="step_2" class="hidden">this is step 2</div>
<div id="step_3" class="hidden">this is step 3</div>
<div id="step_4" class="hidden">this is step 4</div>

CSS

.hidden{display:none;}

JavaScript

var current_index = 1;

$(document).ready(function() {
        setInterval("selectNextStep()", 3000);
});

function selectNextStep() {
    $("#step_"+current_index).fadeOut('slow', function() {
        var next = current_index;
        next = next + 1;
        if (next>4) next = 1;
        $("#step_"+next).fadeIn('slow', function() {
            if (current_index == 4) current_index = 1;
            else current_index ++;
        });
    });
}