Applying onClick to Element Array in a For Loop

Question

I am trying to apply an onClick event to an array of elements in a document, like this:

for (var i = 0; i < myElems.length; i++)
     myElems[i].onClick = "someFunction(this)";

The code is placed inside of an init() function for the onLoad event of the body tag. I notice that when the document loads, the functions wont work.

I've noticed, that if I add an alert() to tell me if the function is the problem:

for (var i = 0; i < myElems.length; i++)
     myElems[i].onClick = "alert('It worked!')";

The document will load and perform the alert for all of the elements, without ever taking into consideration whether or not I actually clicked the element.

What am I doing wrong?

Answer 1

You need to assign the 'onclick' handler to a function:

for (var i = 0; i < myElems.length; i++)
     myElems[i].onclick = function() { someFunction(this);};

Assigning your 'alert' call directly will fire it (as you're seeing). What you want to do is assign your handler to a function that will be called when the event is fired.