multiple div ajax load
I have multiple divs in a page whose content gets loaded via ajax. I would like to show a loading gif that does the following, basically ajax_load_comments and pics are divs with animated gif backgrounds (in comments and pics container respectively), that show up on ajaxStart and hide on ajacstop.

Problem is they both show up regardless which container is being updated. How can I bind them to ajaxStart of a particular container? I like the one time binding in a main js file, rather than doing multiple bindings in different pages.

     $("#ajax_load_pics, #ajax_load_comments").bind("ajaxStart", function(){
            $(this).fadeIn('slow');
            $(this).parent().animate({
                opacity: 0.3
            }, 'slow', function() {
                // Animation complete.
                });
    
        }).bind("ajaxStop", function(){
            $(this).fadeOut('slow');
            $(this).parent().animate({
                opacity: 1
            }, 'slow', function() {
                // Animation complete.
                });
        });
multiple div ajax load
===

I have multiple divs in a page whose content gets loaded via ajax. I would like to show a loading gif that does the following, basically ajax_load_comments and pics are divs with animated gif backgrounds (in comments and pics container respectively), that show up on ajaxStart and hide on ajacstop.

Problem is they both show up regardless which container is being updated. How can I bind them to ajaxStart of a particular container? I like the one time binding in a main js file, rather than doing multiple bindings in different pages.

     $("#ajax_load_pics, #ajax_load_comments").bind("ajaxStart", function(){
            $(this).fadeIn('slow');
            $(this).parent().animate({
                opacity: 0.3
            }, 'slow', function() {
                // Animation complete.
                });
    
        }).bind("ajaxStop", function(){
            $(this).fadeOut('slow');
            $(this).parent().animate({
                opacity: 1
            }, 'slow', function() {
                // Animation complete.
                });
        });