title: Go to Specific Tab on different Page link click and toggle active class
body: <p>I'm developing a web page in which I'm using Twitter's Bootstrap Framework and their Bootstrap Tabs JS. It works great but I am trying to add extra links outside the tabs panel to open the tabs, it works fine clicking the tabs link under the <code>ul</code> <strong><code>--&gt;</code></strong> <code>li</code> links.</p>
  
  <p>But  when I click a link outside the <strong><code>nav panel-tabs</code></strong> how can I have the tab panel switch and the <code>active</code> class added to the <strong><code>nav panel-tabs</code></strong>  <code>li</code> CSS class element when clicking a link outside the <code>nav panel</code> itself (as the <code>active</code> class shows a different background color in my case).</p>
  
  <p>For example:</p>
  
  <p>These links are outside the panel code up the page:</p>
  
  <pre><code>&lt;a href="page.php#gallery"&gt;Gallery&lt;/a&gt;
  &lt;a href="page.php#movies"&gt;Movies&lt;/a&gt;
  </code></pre>
  
  <p>I need to toggle the state of the tab class <code>&lt;ul class="nav panel-tabs"&gt;</code> <strong><code>--&gt;</code></strong> <code>&lt;li&gt;</code> to active and remove it when the other links are clicked. </p>
  
  <p>This is the panel with nav tabs:</p>
  
  <pre><code>&lt;div class="panel-heading"&gt;
      &lt;div class="padpanel"&gt;Panel Heading&lt;/div&gt;
      &lt;div class="pull-left"&gt;
          &lt;ul class="nav panel-tabs"&gt;
              &lt;li class="active"&gt;&lt;a href="#profile" data-toggle="tab"&gt;Profile&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="#gallery" data-toggle="tab"&gt;Gallery&lt;/a&gt;&lt;/li&gt;
              &lt;li&gt;&lt;a href="#movies" data-toggle="tab"&gt;Movies&lt;/a&gt;&lt;/li&gt;
          &lt;/ul&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;div class="panel-body"&gt;
      &lt;div class="tab-content"&gt;
          &lt;div class="tab-pane active" id="profile"&gt;Profile tab &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="panel-body"&gt;
      &lt;div class="tab-content"&gt;
          &lt;div class="tab-pane" id="gallery"&gt;Gallery tab &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;div class="panel-body"&gt;
      &lt;div class="tab-content"&gt;
          &lt;div class="tab-pane" id="movies"&gt;Movies tab &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>