JSFiddle - React, Tailwind, and code Playground

HTML

<div id="wrapper" style='border: 1px solid red'>
  <li>
    <a href="#" id="HCLink">HEATING & COOLING | </a> </li>
 <div class="HCContent">
   <p>Div Content...</p>
 </div>  
</div>

CSS

.HCContent{
    display:none;    
}

JavaScript

$('#HCLink').on('mouseover', function() {
        $('.HCContent').show();
        return false;
    });
    $('#wrapper').on('mouseleave', function() {
        $('.HCContent').hide();
        return false;
    });