<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"> <title>Document</title> <script> function getByClass(oParent,sClass){ var aEle = oParent.getElementsByTagName('*'); var aResult = []; var i = 0; for(var i=0;i<aEle.length;i++){ if(aEle[i].className == sClass){ aResult.push(aEle[i]); } } return aResult; } window.onload=function(){ var oUl = document.getElementById('ul1'); var aBox = getByClass(oUl,'box'); var i = 0; for(var i=0;i<aBox.length;i++){ aBox[i].style.background='red'; } } </script> </head> <body> <ul id="ul1"> <li></li> <li class="box"></li> <li></li> <li class="box"></li> <li class="box"></li> <li></li> <li></li> </ul> </body> </html>