title: Add active state to simple jQuery accordion
body: <p>I've got this simple accordion jQuery script that's almost there with what I need it for, but I'm struggling with one last thing. The animated bits work fine - i.e. if the corresponding content block is closed, it slides open, and vice versa.</p>
  
  <p>Here's the jQuery code:</p>
  
  <pre><code>$('.accordion-heading').click(function(){
      $(this).next().slideToggle(300);
      $('.accordion-content').not($(this).next()).slideUp(300);
      $('.accordion-heading.active').removeClass('active');
      $(this).addClass('active');
  });
  </code></pre>
  
  <p>I want to have an 'active' class on the heading, but I need it to be removed if the same element is clicked twice. At the moment, everything works fine if a non-active heading is clicked. If an already-active heading is clicked again, however, the content block collapses correctly but the heading retains its 'active' class.</p>