JS: How to Iterate/Loop HTML Elements

After JS2015

Since JS2015, both HTMLCollection and NodeList are Iterable Object.

Use for-of Loop. e.g.

for (let x of document.querySelectorAll("*")) x.style.all = "revert";

or use Spread Operator to turn it to array. e.g.

[...document.querySelectorAll("*")].forEach((x) => {
  x.style.all = "revert";
});

or use JS: Array.from to turn it into array. e.g.

Array.from(document.querySelectorAll("*")).forEach((x) => {
  x.style.all = "revert";
});

• [see JS: Array.prototype]

Before JS2015

For before JS2015 code, HTMLCollection and NodeList are not iterable, but still are Array-Like Object. see Apply Array Method to Array-Like Object