jQuery method chaining & var meaning unexpected
<p>1) The code seems simple but method chaining doesn't work:</p>

<pre><code>$('.button').on('click', function(){
$(this).removeClass('shadow').delay(500).addClass('shadow');
 });
</code></pre>

<p>2) This one doesn't work either:</p>

<pre><code>$('.button').on('click' ,function() {
   setTimeout(function() {
    $(this).removeClass('shadow').addClass('shadow');
  }, 500);
});
</code></pre>

<p>3) But this one does!</p>

<pre><code>$('.button').on('click' ,function() {
   var shadow = $(this).removeClass('shadow');
   setTimeout(function() {
   shadow.addClass('shadow');
   }, 500);
   });
</code></pre>

<p>I'd like to ask more experienced coders:
What's wrong with 1?
What kind of additional action does var in 3 that is obsolete in 2? This case turns my var understanding upside down because I thought that var is only some kind of data holder. </p>