JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">
    <div id="red">
        I am red
    </div>
    <div id="blue">
        I am blue
    </div>    
</div>

CSS

#container { position: relative; }
#container DIV {
    position: absolute;
    width: 100%;
}
#blue {
    background: #00C;
}
#red {
    background: #C00;
}

JavaScript

$("#container").hover(
    function() {
        $("#blue").fadeOut(300);
        $("#red").fadeIn(300);
    },
    function() {
        $("#blue").fadeIn(300);
        $("#red").fadeOut(300);        
    }
);