Looping setTimeout
<p>I'm currently trying to wrap my head around some JavaScript.</p>

<p>What I want is a text to be printed on the screen followed by a count to a given number, like so:</p>

<blockquote>
  <p>"Test"</p>
  
  <p>[1 sec. pause]</p>
  
  <p>"1"</p>
  
  <p>[1 sec. pause]</p>
  
  <p>"2"</p>
  
  <p>[1 sec. pause]</p>
  
  <p>"3"</p>
</blockquote>

<p>This is my JS:</p>

<pre><code>$(document).ready(function() {

    var initMessage = "Test";
    var numberCount = 4;    

function count(){

    writeNumber = $("#target");

    setTimeout(function(){
        writeNumber.html(initMessage);
    },1000);

        for (var i=1; i &lt; numberCount; i++) {

    setTimeout(function(){
        writeNumber.html(i.toString());
    },1000+1000*i)};

};

 count();

});
</code></pre>

<p>This is my markup:</p>

<pre><code>&lt;span id="target"&gt;&lt;/span&gt;
</code></pre>

<p>When I render the page, all I get is "Test" followed by "4".</p>

<p>I'm no JavaScript genius, so the solution could be fairly easy. Any hints on what is wrong is highly appreciated.</p>

<p>You can play around with my example here: <a href="http://jsfiddle.net/JSe3H/1/" rel="nofollow">http://jsfiddle.net/JSe3H/1/</a></p>
