Incorrect Toggling (jQuery)

Question

I've a simple menu on my page, that uses this jquery code for basic toggling:

$("#left-nav .block h3").click(function(){
  $(this).next("ul").slideToggle("fast");
  $(this).toggleClass("active");
  $(this).siblings("h3").removeClass("active");
});

The UL is open (display:block via CSS) by default, so on first click, the UL hides (which is fine), but it also adds the "active" class to a menu which just closed! I understand its technically correct, but it not the desired result.

What do I change in the code so it does X when menu is already open and Y when opposite.

Thanks!

Answer 1

Maybe you're looking for .toggle?

$("#left-nav .block h3").toggle(function(){
  $(this).next("ul").slideToggle("fast");
}, function() {
  $(this).toggleClass("active");
  $(this).siblings("h3").removeClass("active");
});

So initially on click it does X, alternatively it does Y.