jQuery get source element in callback

Question

$('.myElem').live('click', function() {
    $(this).hide(500, function() {
        $(this).siblings('.myOtherElem').show();
    });
});

The above doesn't work because $(this) is no longer in correct scope in the callback. How do I pass my original source element into the callback?

Answer 1

Actually your code should work.

To access this within an inner javascript method you might store the reference in the outer method scope:

$('.myElem').on('click', function() {

   var myElem = this;    
    $(this).hide(500, function() {
        $(myElem).siblings('.myOtherElem').show();
    });

});

However in most jQuery methods this is referring to the selector or element used:

$('.myElem').on('click', function() {
    // This refers to the clicked element
    $(this).hide(500, function() {
       // This refers to the clicked element as well 
       $(this).siblings('.myOtherElem').show();
    });    
});

Answer 2

$('.myElem').live('click', function() { 
    var $this = $(this);
    $this.hide(500, function() { 
        $this.siblings('.myOtherElem').show(); 
    }); 
});