title: main menu navigation bar
body: <p>I am trying to add sub-sub-sub menu item in my nav menu but it just stops at sub-sub item .kindly check the image, I add " _ " to make sub-item and " __ " to make sub-sub item but when I put " ___ " it makes sub-sub item with one " _ " written in the item text. so I bring the JS code related to this part.</p>
  
  <pre><code>$('#main-menu').each(function() {
      var iTms = $(this).find('.LinkList ul &gt; li').children('a'),
          iLen = iTms.length;
      for (var i = 0; i &lt; iLen; i++) {
          var i1 = iTms.eq(i),
              t1 = i1.text();
          if (t1.charAt(0) !== '_') {
              var i2 = iTms.eq(i + 1),
                  t2 = i2.text();
              if (t2.charAt(0) === '_') {
                  var l1 = i1.parent();
                  l1.append('&lt;ul class="sub-menu m-sub"/&gt;');
              }
          }
          if (t1.charAt(0) === '_') {
              i1.text(t1.replace('_', ''));
              i1.parent().appendTo(l1.children('.sub-menu'));
          }
      }
      for (var i = 0; i &lt; iLen; i++) {
          var i3 = iTms.eq(i),
              t3 = i3.text();
          if (t3.charAt(0) !== '_') {
              var i4 = iTms.eq(i + 1),
                  t4 = i4.text();
              if (t4.charAt(0) === '_') {
                  var l2 = i3.parent();
                  l2.append('&lt;ul class="sub-menu2 m-sub"/&gt;');
              }
          }
          if (t3.charAt(0) === '_') {
              i3.text(t3.replace('_', ''));
              i3.parent().appendTo(l2.children('.sub-menu2'));
          }
      }
      $('#main-menu ul li ul').parent('li').addClass('has-sub');
      $('#main-menu-nav &gt; li &gt; a').each(function() {
          var $this = $(this),
              txt = $this.attr('href').trim().toLowerCase();
          if (txt == 'homepage') {
              $this.attr('href', '/').parent('li').addClass('li-home');
          }
      });
      $('#main-menu .widget').addClass('show-menu');
  }
  </code></pre>
  
  <p>that's my HTML code</p>
  
  <pre><code>  &lt;div class='header-menu'&gt;
    &lt;div class='container row'&gt; 
      &lt;b:section class='main-menu' id='main-menu' maxwidgets='1' name='Main Menu' showaddelement='yes'&gt;
         &lt;b:widget id='LinkList74' locked='true' title='Link List' type='LinkList' version='2' visible='true'&gt;
           &lt;b:widget-settings&gt;
             &lt;b:widget-setting name='link-3'&gt;#&lt;/b:widget-setting&gt;
             &lt;b:widget-setting name='sorting'&gt;NONE&lt;/b:widget-setting&gt;
             &lt;b:widget-setting name='link-4'&gt;#&lt;/b:widget-setting&gt;
             &lt;b:widget-setting name='text-1'&gt;main item&lt;/b:widget-setting&gt;
             &lt;b:widget-setting name='link-1'&gt;#&lt;/b:widget-setting&gt;
             &lt;b:widget-setting name='text-0'&gt;home&lt;/b:widget-setting&gt;
             &lt;b:widget-setting name='link-2'&gt;#&lt;/b:widget-setting&gt;
             &lt;b:widget-setting name='text-3'&gt;__DropDown 1&lt;/b:widget-setting&gt;
             &lt;b:widget-setting name='link-0'&gt;homepage&lt;/b:widget-setting&gt;
             &lt;b:widget-setting name='text-2'&gt;_DropDown&lt;/b:widget-setting&gt;
             &lt;b:widget-setting name='text-4'&gt;___DropDown 2&lt;/b:widget-setting&gt;
           &lt;/b:widget-settings&gt;
           &lt;b:includable id='main'&gt;
            &lt;b:include name='content'/&gt;
          &lt;/b:includable&gt;
           &lt;b:includable id='content'&gt;
            &lt;ul id='main-menu-nav' role='menubar'&gt;
              &lt;b:loop values='data:links' var='link'&gt;
                &lt;li&gt;&lt;a expr:href='data:link.target' role='menuitem'&gt;&lt;data:link.name/&gt;&lt;/a&gt;&lt;/li&gt;
              &lt;/b:loop&gt;
            &lt;/ul&gt;
          &lt;/b:includable&gt;
         &lt;/b:widget&gt;
       &lt;/b:section&gt;
      &lt;div id='nav-search'&gt;
        &lt;form class='search-form' expr:action='data:blog.searchUrl' role='search'&gt;
          &lt;input autocomplete='off' class='search-input' expr:placeholder='data:messages.searchThisBlog' name='q' type='search' value=''/&gt;
          &lt;span class='hide-search'/&gt;
        &lt;/form&gt;
      &lt;/div&gt;
      &lt;span class='show-search'/&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/xpzpi.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/xpzpi.png" alt="this is how i add drop down items"></a></p>