JSFiddle - React, Tailwind, and code Playground
HTML
<div class="mobileMenuButton" role="button">
<p>
Menu
</p>
</div>
<div class="menu">
<ul>
<li><a href="">Something</a>
<ul>
<li>Something else</li>
</ul>
</li>
</ul>
</div>
CSS
.menu {
display:none;
}
JavaScript
// Make submenu dropdown on hover
$('.menu ul li ul').hide();
$('.menu ul li').hover(function(subMenuDropDown) {
$(this).find("ul").first().stop(true, true).delay(60).slideDown('slow');
}, function() {
$(this).find("ul").first().stop(true, true).delay(60).slideUp('fast');
});
$('.mobileMenuButton').click(function() {
$('.menu').toggle();
subMenuDropDown.preventDefault();
});