title: jQuery Setting position of object dynamically?
body: <p>Okay so I have a weird dilemma. When I get the position of an element and output it, I actually get the real coordinates of the object. Like so below:</p>
  
  <pre><code>var el = $('#element');
  
  var position = el.position();
  
  console.log(position);
  </code></pre>
  
  <p>The output given is something like:</p>
  
  <pre><code>Object { top=0, left=120}
  </code></pre>
  
  <p>Works well, but now if I set the object to <strong>position:absolute</strong>, I get a weird output. The code below is an example of what I'm doing.</p>
  
  <pre><code>var el = $('#element');
  
  var position = el.position();
  
  el.css({
      top: position.top + 'px',
      left: position.left + 'px',
      position: 'absolute'
  });
  
  console.log(position);
  </code></pre>
  
  <p>Now the output I get is something like the one below.</p>
  
  <pre><code>Object { top=0, left=0}
  </code></pre>
  
  <p>So it seems that the <strong>position:absolute</strong> is resetting the top and left.</p>
  
  <p>My question is ... how can I go about setting the left and top positions of an object while setting it to <strong>position:absolute</strong> through jQuery?</p>
  
  <p><a href="http://jsfiddle.net/sbe3C/2/" rel="nofollow">http://jsfiddle.net/sbe3C/2/</a></p>
  
  <p>UPDATE 2:
  Okay as I commented below, the issue seems to be happening only when I try to set position absolute to an object inside an each() loop. I have a jsfiddle example below.</p>
  
  <p><a href="http://jsfiddle.net/geocalleo/atNFz/" rel="nofollow">http://jsfiddle.net/geocalleo/atNFz/</a></p>