JAVASCRIPT

javascript loop through class elements

var els = document.getElementsByClassName("myClass");
for(var i = 0; i < els.length; i++)
{
  console.log(els[i]);
}

javascript loop through class elements

// get elements based on their class name/s
const elements = Array.from(document.getElementsByClassName("css_class_name"));
// using for loop
for (let i = 0; i < elements.length; i++) {
	console.log(elements[i]);
}
// using for of loop
for (const element of elements) {
	console.log(element);
}
/*
using for in loop (Note: this will iterate through keys
in an object, otherwise you wouldn't need to convert the
HTMLCollection returned by
document.getElementsByClassName into an Array)
*/
for (const i in elements) {
	console.log(elements[i]);
}
/*
Note: these all achieve the same thing, but are slightly
different. The basic for loop is actually faster than
the for of and for in loops (by a miniscule, unnoticable
amount). Generally, you want to use whichever version
is most readable for you personally. In this case, the
for of loop is probably the most readable, followed by
the for loop. It is incredibly unlikely you would ever
need use a for in loop in a scenario like this.
*/