JSFiddle - React, Tailwind, and code Playground

HTML

<ul class="menu">
  <li> <a href="#"> FIRST  </a>
    <ul class="sub_m">
        <li> <a href="#"> FIRST  </a></li>
        <li> <a href="#"> SECOND  </a></li>
        <li> <a href="#"> THIRD and some more  </a>
      
           <ul>
            <li> <a href="#"> FIRST  </a></li>
            <li> <a href="#"> SECOND  </a>
             
                <ul>
            <li> <a href="#"> FIRST  </a></li>
            <li> <a href="#"> SECOND  </a></li>
            <li> <a href="#"> THIRD and some more  </a></li>
          </ul>      
             
             </li>
            <li> <a href="#"> THIRD and some more  </a></li>
          </ul>      
          
          
          
      
      </li>
    </ul>      
  
  </li>
   <li> <a href="#"> SECOND  </a></li>
   <li> <a href="#"> THIRD  </a>
    <ul class="sub_m">
   <li> <a href="#"> FIRST  </a></li>
   <li> <a href="#"> SECOND  </a></li>
   <li> <a href="#"> THIRD  </a>
        <ul>
        <li> <a href="#"> FIRST  </a></li>
        <li> <a href="#"> SECOND  </a></li>
        <li> <a href="#"> THIRD and some more  </a></li>
    </ul>      
      </li>
    </ul>
  </li>
   <li> <a href="#"> FORTH </a></li>
   <li> <a href="#"> FIFTH  </a></li>
</ul>

CSS

body {
 font-family:"Trebuchet MS"; 
 font-size:11px; 
}

ul.menu {
list-style:none;
display:table;  
}

ul.menu li {
 float:left;position:relative; 
}

ul.menu li a {
display:table;
line-height:28px;
padding: 0 20px;
background:#dfdfdf;
text-decoration:none;
color:#333333; 
white-space: nowrap;
}

ul.menu li ul{
display:none;
 position:absolute;
}

ul.menu li ul li {
width:100%;  
}



ul.menu li ul li a {
display:block;
padding:0 20px;  
 
}

.app {
 position:absolute;
  top:5px;right:10px;
}

.mah a {
background:#999999!Important;
color:white!Important;  
}

ul.sub_m li > ul {
display:none; 
left:100%;
position:absolute;
top:0;  
}

JavaScript

$("ul li").has("ul").prepend('<span class=app>&raquo</span>');

$("ul li").has("ul").hover(function(){
 $(this).addClass("mah").children("ul").slideDown();
},
 function(){
  $(this).removeClass("mah").children("ul").slideUp()
 });