Turn An HTMLCollection Into An Array

If you are using any of the built-in document query utilities, such as getElementsByClassName():

> document.getElementsByClassName("some-class")
HTMLCollection(5) [ ... ]

Then you are going to get an HTMLCollection in response. An instance of this cannot be iterated over, so you cannot call things like map and filter against it.

To use Array collection methods, you are first going to need to turn the HTMLCollection into an array. You can do this with Array.from:

> Array.from(document.getElementsByClassName("some-class"))
[ ... ]

source

Last updated