JSFiddle - React, Tailwind, and code Playground

HTML

<div class="header-wrapper">
    <div> 
        <nav>
           <ul>
               <li>
                 <a class="link" href="/">Link</a>
               </li>
           </ul>
        </nav>
    </div>
</div>

CSS

.header-wrapper.hoverlink {
  background:red;
}

JavaScript

$(document).ready(function(){
	$(".link").hover(function(){
		$(".header-wrapper:has(a:hover)").addClass("hoverlink");
  });
  $(".link").mouseout(function(){
    $(".header-wrapper").removeClass("hoverlink");
  });
});