title: nav-tabs won't change with click in bootstrap
body: <p>I made two tabs for Fixtures and Results, but when I click on Result tab nothing has change and it remains on Fixtures tab !
  This is my code:</p>
  
  <pre><code>&lt;section&gt;
      &lt;div class="container"&gt;
        &lt;div class="row"&gt;
            &lt;div class="col-lg-12"&gt;
  
              &lt;ul id="myTab" class="nav nav-tabs nav-justified"&gt;
                  &lt;li class="active"&gt;&lt;a href="#service-one" data-toggle="tab"&gt;Fixtures&lt;/a&gt;
                  &lt;/li&gt;
                  &lt;li class=""&gt;&lt;a href="#service-two" data-toggle="tab"&gt;Results&lt;/a&gt;
                  &lt;/li&gt;
              &lt;/ul&gt;
  
              &lt;div id="myTabContent" class="tab-content"&gt;
  
                  &lt;div class="tab-pane fade active in" id="service-one"&gt;
                      &lt;table class="table table-condensed table-hover"&gt;
                          &lt;tbody&gt;
                            &lt;tr&gt;
                              &lt;td class="col-md-2"&gt;&lt;img src="img/leagues/bpl-s.png" alt="bpl" class="img-rounded"&gt;&lt;/td&gt;
                              &lt;td class="col-md-2"&gt;Manchester United&lt;/td&gt;
                              &lt;td class="col-md-1"&gt;vs&lt;/td&gt;
                              &lt;td class="col-md-2"&gt;Tottenham&lt;/td&gt;
                              &lt;td class="col-md-2"&gt;12:45&lt;/td&gt;
                            &lt;/tr&gt;
                          &lt;/tbody&gt;
                      &lt;/table&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
              &lt;div id="myTabContent" class="tab-content"&gt;
                  &lt;div class="tab-pane fade in" id="service-two"&gt;
                      &lt;table class="table table-condensed table-hover"&gt;
                          &lt;tbody&gt;
                            &lt;tr&gt;
                              &lt;td class="col-md-2"&gt;&lt;img src="img/leagues/bpl-s.png" alt="bpl" class="img-rounded"&gt;&lt;/td&gt;
                              &lt;td class="col-md-2"&gt;Manchester United&lt;/td&gt;
                              &lt;td class="col-md-1"&gt;5-2&lt;/td&gt;
                              &lt;td class="col-md-2"&gt;Tottenham&lt;/td&gt;
                              &lt;td class="col-md-2"&gt;Report&lt;/td&gt;
                            &lt;/tr&gt;
                          &lt;/tbody&gt;
                      &lt;/table&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
    &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p>How can I fix this to switch between tabs and show its content ?</p>