title: closing dropdown menu after clicking on a menu item
body: <p>when i click on a button a menu dropdown appears with menu items within. Currently when i click on a menu item the page changes to the clicked content but the menu list still appear and doesn't go away after clicking on a menu item. What do i need to add to my script so that after clicking on any of the menu items the menu would close.</p>
  
  <p>menu button: </p>
  
  <pre><code>&lt;button type="button" class="btn btn-navbar collapsed" data-toggle="collapse" data-target=".nav-collapse"&gt;
      &lt;/button&gt;
  
  
  &lt;div class="nav-collapse collapse" style="height: 0px;"&gt;
          &lt;ul id="Menu" data-bind="template: { name: 'menuItems', foreach: menuItemList, as: 'menuItem' }" class="nav"&gt;
          &lt;/ul&gt;
      &lt;/div&gt;
  </code></pre>
  
  <p>this is the script when clicking on a menu item: </p>
  
  <pre><code>&lt;script type="text/html" id="menuItems"&gt;
      &lt;li class="dropdown" data-bind="css: { active: isActive }"&gt;
          &lt;a class="dropdown-toggle" data-bind="text: title, attr: { href: url }"&gt;
          &lt;/a&gt;
      &lt;/li&gt;
  &lt;/script&gt;
  </code></pre>