Quick jQuery Toggle Problem

I have a little snippet in place that toggle slides in a bit of content, that works fine. What I would like to happen is that the <li> that causes the action in the first place fade out slightly when clicked and return normal otherwise.

My code so far:

jQuery(function($){
  var container = $("#headerform");
  $(开发者_C百科"#loginbutton").click(function(event){
    event.preventDefault();
    if (container.is(":visible")){
      container.slideUp(200);
      // OPACITY TO NORMAL (1)**
    } else {
      container.slideDown(200);
      // HALF OPACITY FOR LI (0.5)**
    }
  });
});

Any help would be great, Thanks.

P.s ID to be toggle faded = #loginbutton

You could use fadeTo() to fade the opacity to the desired level. this points to the clicked element with the event handler, giving you something like:

$(this).fadeTo("slow", 0.5);

and

$(this).fadeTo("slow", 1);