Child Div styles in javascript

manpreet Best Answer 2 years ago

I have got a preview box that gets the color and then changes it when the user does. However i have a child div that needs changine. how can i select the child div through get element by id? this is the java script i have at the moment, how do i change this so i can get the child div front to change color

document.getElementById("flip3D").style.backgroundColor=p1;
#flip3D{
    width:200px;
    height:200px;
    margin:20px;
    float:left;
}
#flip3D > .front{
    ... style stuff is all there just to much toput in and worry about
}

manpreet 2 years ago

var front = document.querySelectorAll('#flip3D .front');
for(var i=0; i<front.length; i++){
  front[i].style.backgroundColor = 'red';
}

var flipEl = document.getElementById("flip3D");
var frontEl = flipEl.getElementsByClassName('front');
for(var i=0; i<frontEl.length; i++){
    frontEl[i].style.backgroundColor = p1;
}