title: Bootstrap: Reset Button Link Active State Back To Normal
body: <p>Here's the <a href="http://jsfiddle.net/frankDraws/cwv45as1/2/" rel="nofollow">fiddle</a>.</p>
  
  <p>I have the behavior almost doing what it needs to do.</p>
  
  <p>Hover works great, button stays active when clicked, and when I click on another  button the previous button becomes inactive.</p>
  
  <p>My issue is when I click on the active button again, it doesn't reset back to inactive (i.e. back to normal). I've tried a number of ways to get the behavior I need but I can't get it to work right.</p>
  
  <p>I've tried <code>$().button()</code>, <code>.toggle()</code>, going over the <a href="http://getbootstrap.com/javascript/#buttons" rel="nofollow">documentation</a>, and a few others I can't remember.</p>
  
  <p>HTML</p>
  
  <pre><code>&lt;a class="btn btn-success btn-md"&gt;Link One&lt;/a&gt;
  &lt;a class="btn btn-success btn-md"&gt;Link Two&lt;/a&gt;
  &lt;a class="btn btn-success btn-md"&gt;Link Three&lt;/a&gt;
  &lt;a class="btn btn-success btn-md"&gt;Link Four&lt;/a&gt;
  </code></pre>
  
  <p>CSS</p>
  
  <pre><code>.btn-active,
  .btn-success:hover {
      background-color: #003c1e;
      color: #fff !important;
      /* Gradient */
      background: #00356B; /* Old browsers */
      background: -webkit-gradient(linear, 0 0, 0 100%, from(#006b34), to(#003c1e)) !important;
      background: -webkit-linear-gradient(#006b34 0%, #003c1e 100%) !important;
      background: -moz-linear-gradient(#006b34 0%, #003c1e 100%) !important;
      background: -o-linear-gradient(#006b34 0%, #003c1e 100%) !important;
      background: linear-gradient(#006b34 0%, #003c1e 100%) !important; /* FF3.6+ */ /* Chrome,Safari4+ */ /* Chrome10+,Safari5.1+ */ /* Opera 11.10+ */ /* IE10+ */ /* W3C */
      filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#006b34', endColorstr='#003c1e',GradientType=0 ) !important; /* IE6-9 */
  
  }
  </code></pre>
  
  <p>JS</p>
  
  <pre><code>$(".btn-success").click(function(){
      $(this).addClass("btn-active").siblings().removeClass("btn-active");
  });
  </code></pre>
  
  <p>fff</p>