Add Event Listener to Collection of HTML Elements

Question

I know that getElementsByTagName and getElementsByClassName need an index identifier in order for the objects to be bound to an event listener.

Answer 1

First, use getElementsByClassName, instead of getElementsByTagName. Then Loop through them, adding the event listener like this:

var inputElem = document.getElementsByClassName('inputs');
var i;
for (i = 0; i < inputElem .length; i++) {
    inputElem [i].addEventListener('click', (function(i) {
        return function() {
           alert(this.value);
        };
    })(i), false);
}

Here it is on jsfiddle