title: bootstrap 2.0 Activating tab and data by url within tab-content
body: <p>I have seen numerous questions generally touching this subject, I know exactly what needs to be done but I'm not "fluent" with jQuery therefore, I cannot successfully do this.</p>
  
  <pre><code> &lt;ul class="nav nav-pills" id="activate"&gt;
      &lt;li&gt;&lt;a href="#tab1" data-toggle="tab"&gt;Tab 1&lt;/a&gt;&lt;/li&gt;
      &lt;li class="active"&gt;&lt;a href="#tab2" data-toggle="tab"&gt;Tab 2&lt;/a&gt;&lt;/li&gt;
   &lt;/ul&gt;
  
   &lt;div class="tab-content"&gt;
       &lt;div id="tab1"&gt;&lt;h1&gt;Data for Tab 1&lt;/h2&gt;&lt;/div&gt;
       &lt;div id="tab2"&gt;
           &lt;a href="#tab1" rel="taburl" data-toggle="tab"&gt;Take me to tab content #1&lt;/a&gt;
       &lt;/div&gt;
  </code></pre>
  
  <p>Ideally, the data of that tab is switched to #tab1, however, the tab will not switch to <code>active</code> class on the <code>href="#tab1"</code> (stays active on <code>#tab2</code> but displays the data from <code>#tab1</code>)</p>
  
  <p>I figured I could use the <code>.first()</code> method and target the first occurrence of <code>href="#tab1</code> and <code>.addClass('active')</code> to this li. But I do not know how to select the li for anylink I link to it to directly target that <code>href</code> ID</p>
  
  <p>I really do not know if this can be done. Can I inject the <code>href</code> data from the link (with jQuery) then add it to the tab link and make it active.</p>
  
  <p>And again, the <code>data-toggle="tab"</code> switches to the right content but will not update the active tab on the navbar, </p>
  
  <p>so is there a way to select that exact 'tab' and <code>.addClass('active')</code> to the <code>&lt;li&gt;</code> once I've fired the link.</p>
  
  <p>Thank you for your time.</p>
  
  <h2>JSFIDDLE EXAMPLE</h2>
  
  <p><a href="http://jsfiddle.net/epiceon/M6NQJ/1/" rel="nofollow">http://jsfiddle.net/epiceon/M6NQJ/1/</a></p>