JSFiddle - React, Tailwind, and code Playground

HTML

<div id="overlay"></div>
<div class="entry-content">
  <div class="expose">something</div>
  <div class="expose">something</div>
  <div class="expose">something</div>
</div>

CSS

#overlay { background:rgba(0,0,0,0.3); display:none; width:100%; height:100%; position:absolute; top:0; left:0; z-index:99998; pointer-events:none}
.expose{
    background-color:red;
    position:relative;
}

JavaScript

$('.entry-content').hover(function() {
    $('#overlay').fadeIn(300);
}, function() {
    $('#overlay').stop().fadeOut(300);
});
$('.expose').hover(function(e) {
    $(this).css('z-index', '99999');
},function(e) {
    $(this).css('z-index', '1');
});