JSFiddle - React, Tailwind, and code Playground

HTML

<a href="javascript:;" class="custom_link" >click me</a>
<div id="container" class="highlight_hide">
    Ding Ding showing
</div>

CSS

.highlight_hide{
    display:none;
}
.highlight_hold,.highlight{
    display:block;
    background-color:"green";
}

JavaScript

$(function(){
    mouse_is_clicked = false;
     $(".custom_link").hover(function(){ 
        $("#container").addClass("highlight");
    }, function(){ 
       alert(mouse_is_clicked);
        if(!mouse_is_clicked){ 
            $("#container").removeClass("highlight");
        }else{
            mouse_is_clicked = false;
        }
    });

      $(".custom_link").click(function(){
           $("#container").addClass("highlight");
          mouse_is_clicked = true;
      });
});