dropdown markup

Multi Level Menu

<!-- Multi Level Menu -->
<nav>
   <ul class="main-nav-menu">
      <!-- First Navigation link. Has a dropdown -->
      <li class="main-nav-item-1">
         <a href="#" class="submenu-toggle">Main Nav Item 1</a>
         <ul class="sub-menu">
            <li class="sub-menu-item-1"><%= link_to subnav_item_1_path %></li>
            <li class="sub-menu-item-2"><%= link_to subnav_item_2_path %></li>
            <li class="sub-menu-item-3"><%= link_to subnav_item_3_path %></li>
         </ul>
      </li>
      <!-- Second Navigation item. Does not have a dropdown -->
      <li class="nav-item-2">
         <%= link_to nav_item_2_path %>
      </li>
        <li class="nav-item-3">
         <%= link_to subnav_item_3_path %>
      </li>
   </ul>
</nav>