JSFiddle - React, Tailwind, and code Playground

HTML

<nav>
<ul>
    <li>fnord
        <ul>
            <li>baz</li>
            <li>foo
                <ul>
                    <li>lorem
                        <ul>
                            <li>lorem_again
                                <ul>
                                    <li>and_again
                                        <ul>
                                            <li>and_again</li>
                                        </ul>
                                    </li>
                                </ul>
                            </li>
                        </ul>
                    </li>
                </ul>
            </li>
        </ul>
    </li>
    <li>gnarf</li>
</ul>
</nav>

CSS

nav ul ul{
    display:none;
}

nav ul li:hover > ul {
		display: block;
	}