title: Linking to a Bootstrap Tab from outside - how to set the tab to "active"?
body: <p>I have a Bootstrap "tab" navigation with 3 different content tabs. It works perfectly except that I want to link to one of the tabs from OUTSIDE the tab navigation. Meaning that when someone clicks a link outside the tab window, it should set to "active" that tab and show the content.</p>
  
  <p>Right now, it shows the content of that tab correctly, but the tab is not set to "active". How do I achieve this so that it should as "active" as if someone had clicked?</p>
  
  <p>Here is the code:</p>
  
  <pre><code>&lt;div&gt;
  &lt;ul class="nav nav-tabs"&gt;
    &lt;li class="active"&gt;&lt;a href="#home" data-toggle="tab"&gt;Home&lt;/a&gt;&lt;/li&gt;
    &lt;li&gt;&lt;a href="#profile" data-toggle="tab"&gt;Profile&lt;/a&gt;&lt;/li&gt;
    &lt;li&gt;&lt;a href="#messages" data-toggle="tab"&gt;Messages&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  &lt;div class="tab-content"&gt;
    &lt;div class="tab-pane active" id="home"&gt;Home Content&lt;/div&gt;
    &lt;div class="tab-pane" id="profile"&gt;Profile Content&lt;/div&gt;
    &lt;div class="tab-pane" id="messages"&gt;Messages Content&lt;/div&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  
  &lt;p&gt;&lt;/p&gt;
  
  &lt;a href="#profile" data-toggle="tab"&gt;Profile Link From Outside&lt;/a&gt;
  </code></pre>
  
  <p>I made a jsFiddle to show it better: <a href="http://jsfiddle.net/fLJ9E/" rel="noreferrer">http://jsfiddle.net/fLJ9E/</a></p>
  
  <p>Thank you very much for any help or hints :)</p>