JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<ul class="menu">
<li class="first">First menu
<ul>
<li>1</li>
<li>1</li>
<li>1</li>
</ul>
</li>
<li class="second">Second menu
<ul>
<li>1</li>
<li>1</li>
<li>1</li>
</ul>
</li>
<li class="third">Third menu</li>
</ul>

CSS

.menu li {
  list-style-type: none;
  float: left;
  padding: 0 4px;
  text-decoration: underline;
  cursor: pointer;
}
.menu li ul {
  padding-left: 0;
  display: none;
}
.menu li ul li {
  clear: left;
}

JavaScript

$(document).ready(function(){
$(".menu li").on("click", function(){
$(this).find("ul").slideToggle();
});
})