Simple jQuery click event issue

Question

I'm using a simple jQuery content panel switcher that I am trying to add a close button to. The close button is working but then after using the close button I can't re-open a panel again. The code for the panel switcher plugin is below:

jcps.fader = function(speed, target, panel) {
jcps.show(target, panel);
if (panel == null) {panel = ''};
$('.switcher' + panel).click(function() {
    var _contentId = '#' + $(this).attr('id') + '-content';
    var _content = $(_contentId).html();
    if (speed == 0) {
        $(target).html(_content);
    }
    else {  
        $(target).fadeToggle(speed, function(){$(this).html(_content);}).fadeToggle(speed);
    }
});
};

And here is the call in my HTML page that I have added the click event to:

    $(document).ready(function() {
       jcps.fader(300, '#switcher-panel');
         $(".close").live('click',function(){
         $(".content").fadeOut("slow");
         });
    });

This all works fine for closing the content panel but I am unable to open a panel again after clicking close.

Answer 1

• Create a variable outside the scope of both of these functions.
• Set it to false by default. Set it to true on close
• Create an If condition for true/false (inside your onClick code), and have it operate close/open code in each of these branches

Does this apply/make sense?

edit--

 $(document).ready(function() {
   jcps.fader(300, '#switcher-panel');
     $(".close").live('click',function(){
     if (Clicked == true){
         //run jquery code to hide
     } else {
         //run jquery code to show
     }
});