title: Bootstrap chevron icon doesn't change onclick, why?
body: <p>I have this section:</p>
  
  <pre><code>&lt;div id="weather"&gt;
  &lt;h4&gt;&lt;i class="icon-chevron-down"&gt;&lt;/i&gt; Weather&lt;/h4&gt;
  </code></pre>
  
  <p>and code to this:</p>
  
  <pre><code>$('#weather h4').click(function (){
      $('#weather .entries').toggle();
      $('#weather .icon-chevron-down').toggleClass('icon-chevron-right');
  });
  </code></pre>
  
  <p><a href="http://jsbin.com/acufaw/1/edit" rel="nofollow">jsbin1</a></p>
  
  <p>and it doesn't work, but if I change places for icon-chevron, it works:</p>
  
  <p><a href="http://jsbin.com/exucew/1/edit" rel="nofollow">jsbin2</a></p>
  
  <p>is it a bug or am I doing something wrong??</p>