Question

Given this code:

counter = 0;
$('div').each(function () {
    counter++;
    console.log(counter + ': Timeout is: ' + $(this).index() * 150);
    setTimeout(testTime(), $(this).index() * 150);
});

function testTime() {
    var currentDate = new Date();
    console.log(counter + ': Call time is: ' + currentDate.getMilliseconds());
}

If you look at the console log you can see the millisecond it is called on and the supposed delay in between each call. As you can see each call is only a few milliseconds between each one.

Answer 1

The first argument to setTimeout should be a function.

You are calling testTime and passing its return value (undefined) as that argument.

Get rid of the ().

Update in response to comments:

If you need to pass arguments, then you need to either need to pass them in an array as the third argument (as per the documentation) or, for wider browser support, use a closure.

counter = 0;
$('div').each(function () {
    counter++;
    console.log(counter + ': Timeout is: ' + $(this).index() * 150);
    setTimeout(testTimeFactory(foo, bar, baz), $(this).index() * 150);
});

function testTime() {
    var currentDate = new Date();
    console.log(counter + ': Call time is: ' + currentDate.getMilliseconds());
}

function testTimeFactory(a, b, c) {
    return function() {
        testTime(a, b, c);
    }
}