jQuery toggle() with toggleClass()

Question

I have a button that toggles a DIV layer on and off. I am trying to add a class to the button so that when its toggled on it appears differently, however I haven't been able to get it working, the class is not being added when the button is toggled.

The button is a list item e.g. On / Off

Here is my code:

$("#btninformation").click(function () {
  $("#map-items-category-one").toggle("slow", function() {
    $(this).toggleClass("toggled-on");
  });
});

Any ideas whats wrong with it?

Thanks Zach

Answer 1

You're toggling the class on the '#map-items-category-one', not on the '#btninformation'. Just grab a reference to the button outside of the inner callback:

$("#btninformation").click(function () {
  var $that = $(this);
  $("#map-items-category-one").toggle("slow", function() {
    $that.toggleClass("toggled-on");
  });
});