JSFiddle - React, Tailwind, and code Playground

HTML

<div class='all'>
<div class='lol'></div>
    <div class='box'></div>  
</div>

CSS

.lol{
    
    cursor:pointer;
    border-radius:100%;
    width:100px;
    height:50px;
    background-color:orange;
    
}

.box{
    
    width:150px;
    height:50px;
   background-color:green;
    display:none;
    position:absolute;
}

JavaScript

$('.all').mouseenter(function(){ 

    $('.box').fadeIn("slow");
    


})

$('.all').mouseleave(function(){ 

    $('.box').fadeOut("slow");
    


})