title: Bootstrap Tab is not working when tab with data-target instead of href
body: <p>I am developing bootstrap tabs with the use of <code>data-target</code> attribute to match the tab panes instead of using the <code>href</code> attribute, since i am developing angular app(<code>href</code> might spoil my route ).</p>
  
  <pre><code>&lt;ul class="nav nav-tabs" id="myTab"&gt;
      &lt;li class="active"&gt;&lt;a data-target="home"&gt;Home&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a data-target="profile"&gt;Profile&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a data-target="messages"&gt;Messages&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a data-target="settings"&gt;Settings&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  
  &lt;div class="tab-content"&gt;
      &lt;div class="tab-pane active" id="home"&gt;...&lt;/div&gt;
      &lt;div class="tab-pane" id="profile"&gt;...&lt;/div&gt;
      &lt;div class="tab-pane" id="messages"&gt;...&lt;/div&gt;
      &lt;div class="tab-pane" id="settings"&gt;...&lt;/div&gt;
   &lt;/div&gt;
  
  &lt;script&gt;
      jQuery(function () {
          jQuery('#myTab a:last').tab('show')
      })
  &lt;/script&gt;
  </code></pre>
  
  <p>Please see this fiddle <a href="http://jsfiddle.net/xFW8t/4/" rel="noreferrer">http://jsfiddle.net/xFW8t/4/</a>. Where i recreated the whole .</p>
  
  <p>I don't want the bootstrap style to be applied for my tabs, i want only the functionality, i want my styles to applied , is it anyway to stop bootstrap style to be applied?
  Please help in this thanks in advance for any help.</p>