title: Bootstrap dropdown-menu doesn't get close when clicking an element
body: <p>I'm firing the bootstrap dropdown menu by using the javascript function <code>dropdown('toggle')</code> as stated <a href="http://getbootstrap.com/javascript/#via-javascript-1" rel="nofollow">in their docs</a>.</p>
  
  <p>Usually dropdowns would hide whenever you click outside them or you select one of their options.</p>
  
  <p>This doesn't happen when firing it through javascript.</p>
  
  <p>In <a href="http://jsfiddle.net/68qkbtLa/2/" rel="nofollow">this reproduction</a> you'll see two menus:</p>
  
  <ul>
  <li>One which works as expected as its fired using the "components" trigger</li>
  <li>And another one, using the right click, which doesn't work as expected. (it doesn't get closed on click outside or even on element click)</li>
  </ul>
  
  <p>I was able to "manually" get rid of the dropdown menu when clicking outside it by using the following:</p>
  
  <pre><code>$('body').removeClass('open');
  </code></pre>
  
  <p>But I'm not quite sure why dropdown menus don't work in the same way as when you fire them by the normal procedure.
  And having to manually hide them doesn't seem like the best solution...</p>