title: Change position of last image
body: <p><strong>The code:</strong></p>
  
  <pre><code>function showLetter() {
      setInterval(function() {
          var letter = imgsArray[random()];
          var top = random();
          var left = random();
          $("div").append("&lt;img src='imgs/" + letter + ".png'&gt;");
          $("div").last().css({"position": "absolute", "top": top + "px", "left": left + "px"});
      }, 1000);
  }
  </code></pre>
  
  <p>In each position of the array <code>imgsArray</code>, I have the name of an image.</p>
  
  <p><strong>What I want to do</strong>:
  Add an image every 1000 ms, giving it a random position on the screen. (If it's possible to prevent overlapping, that'd be great, but I think that has already been answered).</p>
  
  <p><strong>What it does</strong>:
  Every 1000 ms, it adds a new image of a letter, and gives the same properties to all images so they all end up horizontally aligned <strong>:)</strong></p>
  
  <p>I really don't understand why this is happening. With <code>$("div").last().css()</code>, am I not choosing the last image added to the div and changing <strong>only</strong> its properties?</p>
  
  <p>Thanks in advance.</p>