JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
    <li>one
        <ul>
            <li>one 1
            <li>one 2
            <li>one 3
         </ul>
    </li>
    <li>two
        <ul>
            <li>two 1
            <li>two 2
            <li>two 3
         </ul>
    </li>
    <li>thee
        <ul>
            <li>thee 1
            <li>thee 2
            <li>thee 3
         </ul>
    </li>
</ul>

CSS

li ul {
   display: none;
}

li:hover {
    color:red;
}

li:hover ul {
   display: block;
}

li:active {
    color:red;
}

li:hover ul {
   display: block;
}