JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
  <li><a href="#">Меню 1</a>
    <div>
      Превед!
    </div>
  </li>
  <li><a href="#">Меню 2</a>
    <div>
      Кагдила?
    </div>
  </li>
  <li><a href="#">Меню 3</a>
    <div>
      Превед!<br>
      Превед!<br>
      Превед!<br>
      Превед!
    </div>
  </li>
  <li><a href="#">Меню 4</a>
    <div>
      Я DIV! А это - <a href="#">ссылка</a>
    </div>
  </li>
</ul>

CSS

li > a{
    width:2040px;
    height:25%;
    display:block;
    border:1px solid #000;
}
li div{
    width:1200px;
    height:25%;
    border:1px solid #000;
    display:none;
}

JavaScript

$('li > a').mouseover(function(){
    $(this).parent().find('div').css('display', 'block');
})
$('li > a').mouseleave(function(){
    $(this).parent().find('div').css('display', 'none');
})