JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
    <li>one
        <ul>
            <li>one suboption</li>
            <li>one suboption</li>
        </ul>
    </li>
    <li>two
        <ul>
            <li>two suboption</li>
            <li>two suboption</li>
            <li>two suboption</li>
        </ul>
    </li>
    <li>three
        <ul>
            <li>three suboption</li>
            <li>three suboption</li>
            <li>three suboption</li>
        </ul>
    </li>
</ul>

CSS

li {background:#f2f2f2}
ul > li > ul {display:none; margin-left:8px}
ul > li > ul > li {background:#ccc}
ul > li:hover > ul {display:block}