Symbol.iterator is not a function

Question

<div id="par">
    <span id="a1"></span>
    <span id="a2"></span>    
<div id="par2">     
    <span id="a3"></span>
    <span id="a4"></span>
</div>    
</div>

<script>


var ele = document.querySelectorAll('#par span');    

for( var p of ele ){
    console.log(p);
}


</script>

When i run this code I see error

Uncaught TypeError: ele[Symbol.iterator] is not a function

How to fix this problem ?

@Rajesh: No, you cannot use `for in` for them – Bergi Jun 07 '16 at 15:10 — Bergi, Jun 07 '16 at 15:10
@Bergi You are right. My apologies. – Rajesh Jun 07 '16 at 17:37 — Rajesh, Jun 07 '16 at 17:37

score 25 · Accepted Answer · edited May 23 '17 at 12:09

25

Convert NodeList to Array for make it in iterable form, use Array.from() to convert it.

<div id="par">
  <span id="a1"></span>
  <span id="a2"></span>
  <div id="par2">
    <span id="a3"></span>
    <span id="a4"></span>
  </div>
</div>


<script>
  var ele = document.querySelectorAll('#par span');

  for (var p of Array.from(ele)) {
    console.log(p);
  }
</script>

Refer the following question for more info : Are HTMLCollection and NodeList iterables?

edited May 23 '17 at 12:09

Community

1
1

answered Jun 07 '16 at 10:27

Pranav C Balan

113,687
23
165
188

@zloctb : glad to help you :) – Pranav C Balan Jun 07 '16 at 10:36

Symbol.iterator is not a function

1 Answers1

Linked