Forum Moderators: open
<li id="i"><a href="...">...</a></li>
Using CSS, I can control the color of the link by using the following command:
#i a{color:#abcdef}
Using JavaScript CSS, I can control the color of the list item using:
document.getElementById("i").style.color="#abcdef";
But how can I use JavaScript CSS to control the color of the link in the list item id?
Thanks
does this help...
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><script type="text/javascript">
<!--
window.onload=function(){
document.getElementById('foo').onclick=function(){
document.getElementById('i').firstChild.style.color='#abcdef';
return false;
}
}
//-->
</script></head>
<body><ul>
<li id="foo"><a href="#">click this link</a></li>
<li id="i"><a href="#">to change this color</a></li>
</ul></body>
</html>
birdbrain
var li = document.getElementById("i");
var anodes = li.getElementsByTagName("a");
Then loop through anodes and apply the style that way. Though you'd probably be better off defining a class and just assigning that class to the list item. For example:
li.selectedItem a { color: #abcdef; }
And then just attach the class to the list item instead of trying to directly modify the style attribute. Easier to maintain.
