Question

I’ve got this piece of code to toggle a side panel:

$(".example_wrapper_panel_link").click(function() { 
$(".example_wrapper").addClass('example_wrapper_active'); 
$(".example_wrapper_panel").animate({width: "toggle"}, 400);

The addClass is working fine, but now when I click again to hide the div, I want to remove the added class again.

Can’t seem to find the solution for this case.

Thanks in advance for your help.

Answer 1

You should use .toggleClass() method.

$(".example_wrapper_panel_link").click(function() { 
   // instead of addClass() just use toggleClass()
   $(".example_wrapper").toggleClass('example_wrapper_active'); 
   $(".example_wrapper_panel").animate({width: "toggle"}, 400);
});

.toggleClass() will add class to target if not exists and remove it again if exists.