title: Bootstrap content not fade in on change with button tabs
body: <p>On tab change the content hasn't fade in effect. I added the class fade, but I get the same result. Any help?</p>
  
  <p>Here is the live preview:
  <a href="http://jsfiddle.net/DesignPuma/zVgX5/2/" rel="nofollow">http://jsfiddle.net/DesignPuma/zVgX5/2/</a></p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div class="btn-group" id="myTab" data-toggle="buttons-radio"&gt;
      &lt;a class="btn active" href="#popularPosts" data-toggle="tab"&gt;&lt;i class="icon-star"&gt;&lt;/i&gt;&lt;/a&gt;
      &lt;a class="btn" href="#recentPosts" data-toggle="tab"&gt;&lt;i class="icon-tags"&gt;&lt;/i&gt;&lt;/a&gt;
  &lt;/div&gt;
  
  &lt;div id="sidebar-tabs" class="tab-content"&gt;
      &lt;div class="tab-pane fade in active" id="popularPosts"&gt;
          &lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.&lt;/p&gt;
      &lt;/div&gt;
      &lt;div class="tab-pane fade" id="recentPosts"&gt;
          &lt;p&gt;Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.&lt;/p&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>JavaScript:</p>
  
  <pre><code>$('#myTab a').click(function (e) {
    e.preventDefault();
    $(this).tab('show');
  })
  </code></pre>
  
  <p>Thanks</p>