title: How to make bootstrap 3 tab nav active by default?
body: <p>Using bootstrap 3 I am trying this exameple, using class="active" in the li element. Unfortunatelly when the page initially shows up neither tab pane is shown, the whole tab content is empty. The tab navs displayed correctly and when I explicitly click on a tab, the correct pane show up. </p>
  
  <p>What I am missing?</p>
  
  <p>Thanks in advance.</p>
  
  <pre><code>&lt;ul class="nav nav-tabs"&gt;
      &lt;li class="active"&gt;&lt;a href="#graduation" data-toggle="tab"&gt;graduation&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="#graduate" data-toggle="tab"&gt;graduate&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a href="#extension" data-toggle="tab"&gt;extension&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  &lt;div class="tab-content" id="TabContent"&gt;
      &lt;div class="tab-pane fade" id="graduation"&gt;
          &lt;p&gt;
              anything
          &lt;/p&gt;
      &lt;/div&gt;
      &lt;div class="tab-pane fade" id="graduate"&gt;
          &lt;p&gt;
              graduate
          &lt;/p&gt;
      &lt;/div&gt;
      &lt;div class="tab-pane fade" id="extension"&gt;
          &lt;p&gt;
              extension
          &lt;/p&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>