[jQuery] Div Overlay, hide, show loading div.

[jQuery] Div Overlay, hide, show loading div.


Hello,
I'm trying to figure out how to make this happen. Once a user clicks
on a request, it shows the div, which has a background set to a
loading image. From there, once the request is completed, set the div
back to display: none with hide.
Here is my code:
\$('html').click(function(e) {
    \$("#loading").show();
    if ( \$(e.target).is('#query_button') ){
        var store = \$("select#store").val();
        var dept = \$("select#dept").val();
        \$("#query").load('content.cgi', {storeselect: store, deptselect:
dept});
    }
    if ( \$(e.target).is('.view-button') ){
        var invoice = \$(e.target).attr('id');
        var store = \$("select#store").val();
        var dept = \$("select#dept").val();
        \$("#query").load('content.cgi', {storeselect: store, deptselect:
dept, invoiceselect: invoice});
    }
    if ( \$(e.target).is('.btn-slide') ){
        \$("#panel").slideToggle("slow");
        \$(this).toggleClass("active"); return false;
    }
    \$("#loading").hide();
});
First I know that if I click anywhere in <html> the event of showing
and hiding will occur. I need to fix that as well, I was thinking my
hide and show needs to be in a function. Can anyone show me what I'm
doing wrong here?