WP Menu Rollover Nav Item and Effect DIV Elsewhere

I have a WP Navigation with three navigation items. I want to rollover a navigation item (the first of the three) with the ID #mega-menu-item-5128 and change the display of a div ID #ForParents_BlueBar to “block” (it will be hidden with display:none;). I have tried CSS to no avail. All elements are housed between the < header >< /header > tags.

#mega-menu-item-5128 is an < li > housed in the < nav > element.

#ForParents_BlueBar is a < div > directly after the < nav > element and surrounding < div > elements. Below is a simplified, but accurate representation.

I also included a #Hello test navigation item that DOES work. Which is why I am so baffled.

<div>
  <div>
    <nav>
      <ul> 
        <li id="mega-menu-item-5128"><a class="mega-menu-link" href="#" tabindex="0">For Parents</a></li>
      </ul>
    </nav>
  </div>
</div>
<div class="TestHello" id="Hello"><a href="#">Hello</a> </div>
<div class="Submenu_Container">
  <div id="ForParents_BlueBar">
    [Max Mega Menu Plugin Code]
  </div>
</div>

For testing purposes, I just made the padding big and apply a border so I can easily see if I am hooked correctly, I have this CSS:

#mega-menu-item-5128:hover ~ #ForParents_BlueBar {
  /*display:none!important;*/
  border: 2px solid red !important;
  padding: 40px !important;
}

It does not work.

I have also tried jQuery (added through functions.php).

function addCustomScript(){
?>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
<script>
$(document).ready(function () {
  $('#mega-menu-item-5128').hover(function() {
	  $('#ForParents_BlueBar').attr('style', 'padding: 100px !important');
  }, function() {
	  $('#ForParents_BlueBar').attr('style', 'padding: 0px !important');
  });
});
	$(document).ready(function () {
  $('#Hello').hover(function() {
	  $('#ForParents_BlueBar').attr('style', 'padding: 100px !important');
  }, function() {
	  $('#ForParents_BlueBar').attr('style', 'padding: 0px !important');
  });
});
</script>
<?php
}
add_action('wp_head', 'addCustomScript');

This does nothing for the nav, but the test #Hello works.

I have been trying everything I can think of, and everything I can find on the internet, but nothing is working.

Any help would be really appreciated.