jQuery addClass() removeClass() methods
<p>I am having a problem with jQuery methods .addClass() .removeClass</p>

<p>JsFiddle : <a href="http://jsfiddle.net/HEM7Q/4/" rel="nofollow">http://jsfiddle.net/HEM7Q/4/</a></p>

<pre><code>$(document).ready(function () {
  $(".button").click(function(e) {
  $(".position1").animate({left:"400px"},2000, function(e){
     $(".position1").addClass("position2").removeClass("position1");
     })
  });
});
</code></pre>

<p>see, initially the css.left is 20 px (because its defined in the class .position1). now, I animate the div till its left become 400px. After the animation is completed, I addClass position2 (where left is 50px) and I removeClass position1.</p>

<p>so shouldn't the div come back to left == 50 px after the completion of the animation?
why is it not happening, and what is the right code for it?</p>
