JSFiddle - React, Tailwind, and code Playground
HTML
<div class="blackwrap">
<header class="blackbar">
<h2>Before he knew it, he couldn't see a thing.</h2>
<h4>He fumbled around for the <a id="flash">flashlight</a> on his phone.</h4>
</header>
</div> <!-- .blackwrap-->
CSS
.blackbar {
background: black;
color: white;
}
.blackbar.lit {
background:yellow;
color:black;
}
JavaScript
$("#flash").on("mouseover", function(){
$(".blackbar").addClass("lit");
}).on("mouseout", function(){
$(".blackbar").removeClass("lit");
});