JSFiddle - React, Tailwind, and code Playground
HTML
<div id="buttons">
<div id="box"></div>
<div id="content"></div>
</div>
CSS
#box {
width: 10vw;
height: 10vw;
background-color: blue;
}
.box {
width: 10vw;
height: 10vw;
background-color: indigo;
float: left;
margin-left: 5px;
display: none;
}
#content {
width: 100%;
height: 10vw;
background-color: red;
padding: 5px;
}
JavaScript
$( "#box" ).on('mouseenter', function() {
$( "#content").append("<div class='box'></div>");
$('.box').fadeIn();
});