ZCA Bootstrap 4 Template [Support Thread]

[Dave224]

I'm working on adding responsive multilevel dropdown menus on the navigation bar to the ZCA Bootstrap template. I've added a dropdown button to the bar that when clicked, opens the first level dropdown. An item in this dropdown opens up a second level dropdown, but an item in the second dropdown will not open to the third level. The html follows the pattern for multilevel dropdown menu examples I can find for bootstrap 4. I'm a Bootstrap novice and would appreciate any suggestions. A sample of the relevant code follows.

<!--bof-navigation display-->
	   <div id="navMainWrapper">
	      <div id="navMain">
		 <nav class="navbar fixed-top mx-3 navbar-expand-lg rounded-bottom">
	            <div class="collapse navbar-collapse" id="navbarSupportedContent">
		       <ul class="navbar-nav ml-auto">
			  <li class="nav-item dropdown">
			     <a class="nav-link dropdown-toggle" href="#" data-toggle="dropdown">Button</a>
			     <ul class="dropdown-menu">
				 <li>
				    <a class="dropdown-item" href="https://blah...blah"><i class="fas fa-caret-left"></i> Level 1 Item 1</a>
				    <ul class="submenu dropdown-menu">
			               <li>
				          <a class="dropdown-item" href="https://blah...blah"><i class="fas fa-caret-left"></i>Level 2 Item 1" </a>
                                          <ul class="submenu dropdown-menu">
					     <li>
					        <a class="dropdown-item" href="https://blah...blah">Level 3 Item 1</a>
                                             </li>
                                          </ul>
                                       </li>
                                    </ul>
                                 </li>
                             </ul>
                          </li>
                       </ul>
                    </div>
                 </nav>
              </div>
           </div>