title: Clicking on sub menu not opening the page it is hiding the sub menu in HTML
body: <p>Hi i have created a dropdown sidebar menu but the problem when i click on main menu it is displaying the sub menu correctly but the problem is when i click on sub menu it is not opening the link it is getting hided.Here is the code for that.</p>
  
  <pre><code>&lt;aside id="sidebar-wrapper"&gt;
              &lt;div class="sidebar-brand"&gt;
                &lt;h2&gt;Materno Platform&lt;/h2&gt;
              &lt;/div&gt;
              &lt;ul class="sidebar-nav"&gt;
                  &lt;li&gt;&lt;a href="index.html"&gt;Dashboard&lt;/a&gt;&lt;/li&gt;
                  &lt;li&gt;&lt;a href="#"&gt;Customers&lt;/a&gt;&lt;/li&gt;
                  &lt;li&gt;&lt;a href="#"&gt;providers&lt;/a&gt;&lt;/li&gt;
                  &lt;li&gt;&lt;a href="#"&gt;User Management&lt;/a&gt;&lt;/li&gt;
                  &lt;li&gt;&lt;a href="#"&gt;Plans&lt;/a&gt;&lt;/li&gt;
                  &lt;li class="has-ul"&gt;&lt;a href="#"&gt;Order Fullfillment&lt;i class="fa fa-plus"&gt;&lt;/i&gt;&lt;/a&gt;
                    &lt;ul class="sub-ul"&gt;
                      &lt;li&gt;&lt;a href="#"&gt;Plan Purchases&lt;/a&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;a href="#"&gt;Med Orders&lt;/a&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;a href="#"&gt;Lab Orders&lt;/a&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;a href="#"&gt;predictive Analytics&lt;/a&gt;&lt;/li&gt;
                    &lt;/ul&gt;
                  &lt;/li&gt;
                  &lt;li class="has-ul"&gt;&lt;a href="#"&gt;Master Data Management&lt;i class="fa fa-plus"&gt;&lt;/i&gt;&lt;/a&gt;
                    &lt;ul class="sub-ul"&gt;
                      &lt;li&gt;&lt;a href="careplans.html"&gt;Care Plans&lt;/a&gt;&lt;/li&gt;            
                    &lt;/ul&gt;
                  &lt;/li&gt;
                  &lt;li&gt;&lt;a href="#"&gt;Transcriptions&lt;/a&gt;&lt;/li&gt;
                  &lt;li&gt;&lt;a href="profile.html"&gt;Profile&lt;/a&gt;&lt;/li&gt;         
              &lt;/ul&gt;
          &lt;/aside&gt;
  
  &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"&gt;&lt;/script&gt;
   &lt;script type="text/javascript"&gt;
    $("#sidebar-toggle").click(function(e) {
    e.preventDefault();
    $("#wrapper").toggleClass("toggled");
    });
    $('li.has-ul').click(function() {
    $(this).children('.sub-ul').slideToggle(500);
    $(this).toggleClass('active');
    event.preventDefault();
    });
  </code></pre>
  
  <p>Fiddle Link: <a href="https://jsfiddle.net/3yfdcto0/1/" rel="nofollow noreferrer">https://jsfiddle.net/3yfdcto0/1/</a></p>