JSFiddle - React, Tailwind, and code Playground

HTML

<div class='red'></div>
<div class='blue'></div>

CSS

div {height:200px; width:200px}
div.red {background-color:red;}
div.blue{background-color:blue; display:none}

JavaScript

window.switchIn = function () {
    $('.red').fadeToggle(function() {
        $('.blue').fadeToggle(function() {
            setTimeout(function() {window.switchOut();}, 500);
        });
    });
    
}

window.switchOut = function () {
    $('.blue').fadeToggle(function() {
        $('.red').fadeToggle(function() {
            setTimeout(function() {window.switchIn();}, 500);
        });
    });

}

setTimeout(function() {window.switchIn();}, 500)