JSFiddle - React, Tailwind, and code Playground

HTML

<div id="hoverdiv"></div>    
 <div style="margin:0 auto;">
    <div class="hover" hovertext="This is div 1">Div 1</div>
    <div class="hover" hovertext="This is div 2">Div 2</div>
    <div class="hover" hovertext="This is div 3">Div 3</div>
</div>

CSS

#hoverdiv{
    display:none;
    position:absolute;
    font-size:12px;
    background: rgba(0,0,0,.6);
    color: #DDD;
    border: 1px solid #999;
    padding:10px;
    z-index:10000;
}

JavaScript

$(document).on('mousemove','.hover',function(e){   

    var hovertext = $(this).attr('hovertext');
    $('#hoverdiv').text(hovertext)
    .css('top',e.pageY-95)
    .css('left',e.pageX+10)
    .show();

 }).on('mouseout','.hover',function(){       
 $('#hoverdiv').hide();      
 });