Jer Jer - 1 year ago 191
Javascript Question

Why does my call to forEach on an array result in "Uncaught TypeError: undefined is not a function"


In the above fiddle, I'm simply trying to iterate over an array of elements. The array is non-empty, as the log statements prove. Yet the call to forEach gives me the (not so helpful) "Uncaught TypeError: undefined is not a function" error.

I must be doing something stupid - what am I doing wrong?

My code:

<div class="myClass">Hello</div>

var arr = document.getElementsByClassName('myClass');
arr.forEach(function(v,i,a) {

.myClass {
background-color: #FF0000;

Answer Source

That's because document.getElementsByClassName returns a HTMLCollection, not an array.

Fortunately it's an "array-like" object (which explains why it's logged as if it was an object and why you can iterate with a standard for loop), so you can do this :

[]'myClass'), function(v,i,a) {

With ES6 (on modern browsers or with Babel), you may also use Array.from which builds arrays from array-like objects:

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download