Jquery - looping with nested functions and setInterval()
<p>Probably not the clearest title, but here goes - I need to display two independent countdowns on a page, accepting a user input for the starting value for each. When one reaches zero, the other starts and counts down to zero. Code for this is below, and working as expected.</p>

<p>I call the Timer1 function, which checks a variable for the starting value, if it exists, the count starts. When the count is zero, I clear the interval, reset the display to the starting value, and fire the second timer, if it has a value assigned:</p>

<pre><code>    function Timer1() {
        var gDuration = goTime;
        countdown = setInterval(function () {
            if (gDuration &gt;= 0) {
                $("#durationValue").html(ToTime(gDuration));
                gDuration--;
            }
            else {
                clearInterval(countdown);
                $("#durationValue").html(ToTime(goTime));
                if (restTime != 0) {
                    Timer2();
                }
            }
        }, 1000);
    }

    function Timer2() {
        var rDuration = restTime;
        countdown = setInterval(function () {
            if (rDuration &gt;= 0) {
                $("#restValue").html(ToTime(rDuration));
                rDuration--;
            }
            else {
                clearInterval(countdown);
                $("#restValue").html(ToTime(restTime));
            }
        }, 1000);
    }
</code></pre>

<p>The next step is to allow that process to run for a set number of loops - I've tried wrapping setInterval in Timer1 in a for loop, which doesn't work. Any ideas how to better go about this?</p>
