title: Bootstrap 3 closing dropdown after click problems with IE and Chrome
body: <p>I'm trying to close via jQuery my Bootstrap 3 drop down after clicking on an list item.</p>
  
  <p>html</p>
  
  <pre><code>&lt;div class="btn-group"&gt;
      &lt;button type="button" data-toggle="dropdown" class="btn btn-default dropdown-toggle"&gt;10 &lt;span class="caret"&gt;&lt;/span&gt;&lt;/button&gt;
      &lt;ul class="dropdown-menu"&gt;
          &lt;li&gt;&lt;a href="javascript: void(0)"&gt;10&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;&lt;a href="javascript: void(0)"&gt;20&lt;/a&gt;&lt;/li&gt;
      &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>JS</p>
  
  <pre><code>$('.header').on('click', '.dropdown-menu li a', function(e){
      e.stopPropagation();
      var number = $(this).text(),
      $(this).parents(".btn-group").find('.btn').html(number + " &lt;span class=\"caret\"&gt;&lt;/span&gt;");
      $(this).dropdown("toggle"); // Use for close dropdown on click
  
  });
  </code></pre>
  
  <p>Unfortunately this solution does not work well with IE and Chrome.
  In fact, after that I ran a few times the choice, the drop down stops show elements. </p>
  
  <p>With Firefox it seems to work without problems.
  How can I solve my problem? </p>
  
  <p>Thank you</p>
  
  <p>EDIT <br></p>
  
  <p><a href="https://jsfiddle.net/bvq6ucqq/" rel="nofollow">jsfiddle</a></p>
  
  <p>I noticed that even with firefox I have the same problems</p>