JSFiddle - React, Tailwind, and code Playground

by ten1seven

HTML

<ul>
<li id="nav">
        <a href="#">Main Link</a>
        <ul>
            <li><a href="#">Sub Link</a></li>
            <li><a href="#">Sub Link</a></li>
            <li><a href="#">Sub Link</a></li>
        </ul>
    </li>
</ul>

CSS

li {
    position: relative;
}
ul ul {
    display: none;
}

JavaScript

$('#nav a').focusin(function () {
    $('#nav ul').show();
}).focusout(function () {
    $('#nav ul').hide();
});