JSFiddle - React, Tailwind, and code Playground

HTML

<div id="toplayer" class="layer" style="z-index:20; pointer-events:none; background-color: white; display: none;">Top layer</div>
<div id="bottomlayer" class="layer" style="z-index:10;">Bottom layer</div>

CSS

.layer {
    position:absolute;
    top:0px;
    left:0px;
    height:400px;
    width:400px;
}

JavaScript

$(document).ready(function(){
$("#bottomlayer").hover(function(){
  $("#toplayer").css("display","block");
}, function(){
   $("#toplayer").css("display","none");
});
});