title: how to remove active state on other links when another link is active
body: <p>I only want one link to be in an active state. How do I remove link's active state when I click on other links to make that specific link active instead? I'm using jQuery addClass and removeClass</p>
  
  <p>Here's what I've got</p>
  
  <pre><code>&lt;style&gt;.active {border-bottom: 3px solid #DB3030;}&lt;/style&gt;
  
  &lt;div class="link"&gt;&lt;a href="#scroll1" class="scroll"&gt;Link 1&lt;/a&gt;&lt;/div&gt;
  &lt;div class="link"&gt;&lt;a href="#scroll2" class="scroll"&gt;Link 2&lt;/a&gt;&lt;/div&gt;
  &lt;div class="link"&gt;&lt;a href="#scroll3" class="scroll"&gt;Link3&lt;/a&gt;&lt;/div&gt;
  
  
  $(document).ready(function(){
      $(".link a").click(function() {
          $(this).siblings().removeClass('active').end().addClass('active');
      });
  });
  </code></pre>