javascript - JS error object has no method addEventListener

Question

I have following code

var el = document.querySelectorAll('.block');
console.log(el);
el.addEventListener('click', function () {
    alert('hello');
}, false);

However, it returns an error Uncaught TypeError: Object #<NodeList> has no method 'addEventListener'

Why am I getting this error and how can I solve this issue?

Answer 1

Because, exactly as the error message tells you NodeLists don't have an addEventListener method. You should iterate over the nodelist, and addEventListener to each element within –?assuming that you want to add N listeners.

Alternately, select only a single element, and the remainder of your code will work as written.