JSFiddle - React, Tailwind, and code Playground

by gol ngaz²

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.0/jquery.min.js"></script>
<ul id="menu">
  <li>
    <a href="#">Menu 1</a>
    <ul style="display:none;" >
      <li>Sous-menu 1</li>
      <li>Sous-menu 2</li>
      <li>Sous-menu 3</li>
    </ul>
  </li>
  <li>
    <a href="#">Menu 2</a>
    <ul style="display:none;">
      <li>Sous-menu 1</li>
      <li>Sous-menu 2</li>
      <li>Sous-menu 3</li>
    </ul>
  </li>
</ul>

JavaScript

$("#menu li").click(function(){
console.log("hello");
  sous_menu = $(this).children('ul');
  console.log(sous_menu);
  if (sous_menu.css('display') == 'inline'){
    sous_menu.css('display', 'none');
  }
  else{
    sous_menu.css('display', 'inline');
  }
});