JSFiddle - React, Tailwind, and code Playground

by Shaunak Deshpande

HTML

<div id="1" align="center" style="margin-top:5px;background-color:lightblue">One</div>
<br>
<div id="2" align="center" style="color:grey;background-color:lightgrey;height:50px;">Two</div>
<br>
<div id="3" align="center" style="color:white;background-color:black">Three</div>

JavaScript

$("#1").mouseover(function () {
    $("#1").animate({
        margin: "+=20px"
    }, 500);

}

);
$("#2").click(function () {
    $("#2").hide();

});

$("#1").click(function(){
$("#2").show();});
$("#3").mouseover(function () {
    $("#3").animate({
        margin: "+=20px"
    }, 500);

});