Trouble with multiple age counters (timers)
<p>I have a page where I want to have "age counters" for bids put in by users. The number of users will vary from situation to situation, so that needs to be taken into consideration. I wrote this:</p>

<pre><code>function timer(i) {
          // this selects a 'hh:mm:ss' timestamp
        if ($("#time_0" + i).text() !== "") {
            var now = new Date();
            var date = now.toDateString();
            var tStamp = new Date(date + "," + $("#time_0" + i).text());
            var diff = now - tStamp;
            var mins = Math.floor(diff / (1000 * 60));
            var secs = Math.floor((diff / 1000) % 60);
            if (mins &lt; 10) {
                mins = "0" + mins;
            }
            if (secs &lt; 10) {
                secs = "0" + secs;
            } else if (secs == 60) {
                secs = "00";
            }
            $("#user" + i + "-t").text(mins + ':' + secs);
        }
}

$(document).ready(function() {
                    //
            var ids = [];
            $("td[id^='time_0']").each(function() {
                var i = ($(this).attr("id")).slice(-1);
                ids.push(i);
            });
            for (i in ids) {  // in my example ids = [1,2,3]
                setInterval(function() {timer(i);}, 1000);
            }
});
</code></pre>

<p>The timer itself functions just as I want it to, but only for user #2 (the middle one). I thought that if I encountered this problem, it would be either the first or last user in the list that had a working timer, but I'm getting blank cells for users #1 and #3.</p>

<p>Does anyone have any ideas as to how I can fix this? Thank you for your time.</p>

<p>==Edit==</p>

<p>I made a bare-bones <a href="http://jsfiddle.net/UQZTt/2/" rel="nofollow">jsfiddle</a></p>
