JSFiddle - React, Tailwind, and code Playground

HTML

<nav>
  <ul>
    <li>
      <a>PARENT</a>
      <ul>
        <li>
          <a href="#">CHILD 1</a>
        </li>
        <li>
          <a href="#">CHILD 2</a>
        </li>
        <li>
          <a href="#">CHILD 3</a>
        </li>
      </ul>
    </li>
  </ul>
</nav>

SCSS

nav li:not(.on) li {
  display: none;
}

JavaScript

var list = $('nav').children('ul').children('li');
  var $level1 = list.children('a');

  $level1.click(function() {
	    list.toggleClass('on');
  });