JSFiddle - React, Tailwind, and code Playground

HTML

<div class="content">    

                   <div class="parent_div">
                           <div class="hotqcontent"> 
                               content of first div goes here...
                           </div><hr>
                   </div>
                   <div class="parent_div">
                           <div class="hotqcontent"> 
                               content of second div goes here...
                           </div><hr>
                   </div>
        <div class="parent_div">
                           <div class="hotqcontent"> 
                               content of third div goes here...
                           </div><hr>
                   </div>
        <div class="parent_div">
                           <div class="hotqcontent"> 
                               content of fourth div goes here...
                           </div><hr>
                   </div>
</div>

CSS

.parent_div{
background:red;
}

JavaScript

$(document).ready(function(){
    $('.parent_div').on('mouseover',function(){
        $(this).children('.hotqcontent').show();
    }).on('mouseout',function(){
        $(this).children('.hotqcontent').hide();
    });;
});