I'm trying to use getElementsByClassName to hide some elements on my page. I used the 1st answer here:
What is an alternative to using getElementByClass for hiding multiple elements?
to write my own code and it works in Chrome and FF but not in IE9. Everything I've read says getElementsByClassName should work in IE9. Rather than put my own code, the code below is the answer from the link above since it's similar to my own and already compact. When I load this into IE9, the buttons do nothing (fine in Chrome and FF). If I put try and catch around the code in the functions, it says object error. Is it supposed to work?
<head>
<script type="text/javascript">
function hideNames()
{
var list = document.getElementsByClassName("webname");
for (var i = 0; i < list.length; i++) {
list[i].style.display="none";
}
}
function showNames()
{
var list = document.getElementsByClassName("webname");
for (var i = 0; i < list.length; i++) {
list[i].style.display="block";
}
}
</script>
</head>
<body>
<p class="webname">Webname</p>
<p class="webname">test</p>
<input type="button" onclick="hideNames()" value="Hide Web Names" />
<input type="button" onclick="showNames()" value="Show Web Names" />
</body>