1. Using getElementsByTagName
This code loops through each element of the page and check`s it`s class name:
for(var i=0;i<document.getElementsByTagName('*').length;i++){
if(document.getElementsByTagName('*')[i].className == 'YOUR-CLASS'){
document.getElementsByTagName('*')[i].style.backgroundColor = 'black';
}
}
2. Creating a getElementsByClass function
This code creates the getElementsByClass function what returns an array of elements with the selected class name:
document.getElementsByClass = function(class){
var itemsfound = new Array;
var elements = document.getElementsByTagName('*');
for(var i=0;i<elements.length;i++){
if(elements[i].className == class){
itemsfound.push(elements[i]);
}
}
return itemsfound;
}
Use it in the following way to select only the element with the specified index:
document.getElementsByClass('YOUR-CLASS')[0].style.backgroundColor = 'black';
Or use this if you want to select each element:
for(var i=0;i<=document.getElementsByClass.length;i++){
document.getElementsByClass('YOUR-CLASS')[i].style.backgroundColor = 'black';
}
Note: Javascript is case sensitive
If you like it don`t forget the +rep
