jQuery "this" changing in chain
<p>I have a div that has a div  inside it that will delete the outer div when clicked.  The jQuery to make this happen is</p>

<pre><code>275 $(document).on('click','.rightMenuDelete', function(event) {
276   $(this).parents('.cell').  
277   fadeOut(300, function()  {
278     $(this).remove();});
279  });
</code></pre>

<p>At 276 the this keyword is the inner div we clicked.  By 277 the wrapped set has the outer div we want to delete.  But I want to fade out the outer div before I remove it, so 277 applies the fadeOut and then the callback removes the outer div.  What surprises me a bit is that 278 works.  The this keyword at 278 is  the outer div, as we want , and no longer the inner div that we clicked originally.  Can anyone throw some light on how the this keyword can change as control moves down a jQuery chain?</p>

<p>Thanks </p>
