title: Only one active div allowed using jQuery
body: <p>Let's say I have 3 divs each with class <code>item</code> and only one can have class <code>active</code> at a time.  For example:</p>
  
  <pre><code>&lt;div class="item active"&gt;1&lt;/div&gt;
  &lt;div class="item"&gt;2&lt;/div&gt;
  &lt;div class="item"&gt;3&lt;/div&gt;
  </code></pre>
  
  <p>I have a jQuery binding code that activates a div on the click event:</p>
  
  <pre><code>$(document).ready(function () {
      $('.item').bind('click', function() {
          addClass('active');        
          // now I need to remove active class from the previous selected item
      });
  });
  </code></pre>
  
  <p>What is the best way of doing the housekeeping where I would remove the active class from any other div that may be active?</p>
  
  <p>Thanks in advance. </p>