Pass custom variable to anonymous jQuery click function

Question

I want to pass current iteration of foreach loop on click event, yet it returns "undefined" - but why?

for (var i = 0; i < __ARR_selectors.length; i++) {
    __ARR_selectors[i].click( function(e, i) {
        console.log(i); //returns undefined
}

Answer 1

Try this:

for (var i = 0; i < __ARR_selectors.length; i++) {
    (function (i) {
        __ARR_selectors[i].click( function() {
            console.log(i); //returns undefined
        });
    })(i);
}

The problem with your code is the variable i is updated for each iteration of the loop, so the click event gets bound to the last value that i had.

To get round the issue, create an anonymous function which accepts a parameter of i which gets round javascript closures.