title: hide/show click here on bootstrap tab selection
body: <p>I want to hide the 'Click Here' option whenever a specific tab is selected. Other three 'click here' should be visible when one is selected.</p>
  
  <p>I cannot figure out how to do this with two tabs doing the same thing. The image should be always visible but the click here button under the image should be hidden if it is selected.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;div&gt;
  
    &lt;!-- Nav tabs --&gt;
    &lt;ul class="nav nav-tabs" role="tablist"&gt;
      &lt;li role="presentation" class="active"&gt;
        &lt;a href="#home" aria-controls="home" role="tab" data-toggle="tab"&gt;&lt;img src="http://placehold.it/140x100"&gt;&lt;/a&gt;
        &lt;a href="#home" aria-controls="home" role="tab" data-toggle="tab"&gt;Click Here&lt;/a&gt;
      &lt;/li&gt;
      &lt;li role="presentation"&gt;
        &lt;a href="#profile" aria-controls="profile" role="tab" data-toggle="tab"&gt;&lt;img src="http://placehold.it/140x100"&gt;&lt;/a&gt;
        &lt;a href="#profile" aria-controls="profile" role="tab" data-toggle="tab"&gt;Click Here&lt;/a&gt;
      &lt;/li&gt;
      &lt;li role="presentation"&gt;
        &lt;a href="#messages" aria-controls="messages" role="tab" data-toggle="tab"&gt;&lt;img src="http://placehold.it/140x100"&gt;&lt;/a&gt;
        &lt;a href="#messages" aria-controls="messages" role="tab" data-toggle="tab"&gt;Click Here&lt;/a&gt;
      &lt;/li&gt;
      &lt;li role="presentation"&gt;
        &lt;a href="#settings" aria-controls="settings" role="tab" data-toggle="tab"&gt;&lt;img src="http://placehold.it/140x100"&gt;&lt;/a&gt;
        &lt;a href="#settings" aria-controls="settings" role="tab" data-toggle="tab"&gt;Click Here&lt;/a&gt;
      &lt;/li&gt;
    &lt;/ul&gt;
  
    &lt;!-- Tab panes --&gt;
    &lt;div class="tab-content"&gt;
      &lt;div role="tabpanel" class="tab-pane active" id="home"&gt;Content Home&lt;/div&gt;
      &lt;div role="tabpanel" class="tab-pane" id="profile"&gt;Content Profile&lt;/div&gt;
      &lt;div role="tabpanel" class="tab-pane" id="messages"&gt;Content Messages&lt;/div&gt;
      &lt;div role="tabpanel" class="tab-pane" id="settings"&gt;Content Settings&lt;/div&gt;
    &lt;/div&gt;
  
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <p>Please have a look at my codepen.
  <a href="http://codepen.io/audhit/pen/WQEQeb" rel="nofollow">Code Pen Link</a>  </p>