Get element and hide its childs

JavaScript
1

Hi,

I have html like this

<div class="nH" id="ga"></div>
<div class="nH" style="width:225px">
    <div class="nH"></div>
    <p>Stuffs</p>
</div>

I need to hide (display:none) all childs of the element <div class=“nH” style=“width:225px”>

How could I do that in plain javascript?

2 
<script type="text/javascript">

function hideChildrenOfDivAfter( id )
{
 var e = document.getElementById( id ), children;

 if( e )
  while( (e = e.nextSibling) && e.nodeName !== 'DIV' )
  ;

 if( e )
 {
  children = e.childNodes;

  for(var i in children )
   if( children[ i ].style )
    children[ i ].style.display = 'none' ; 
 }
}

</script>

<p><input type='button' value='Hide' onclick='hideChildrenOfDivAfter("ga")'>
3

Thanks Sgt. As trying to write a user script for greasemonky, to customized a website, I can’t change the html as your suggestion. The html is fixed.

4 
function nh225(){
    var who, child, 
    nodes= document.getElementsByTagName('*');
    for(var i= 0, L= nodes.length; i<L; i++){
        who= nodes[i];
        if(who.className== 'nh' && 
          who.style.width== '225px'){
            child= who.lastChild;
            while(child!= null){
                if(child.style) child.style.display= 'none';
                child= child.previousSibling;
            }
            return who;
        }
    }
    return null; 
}
5

This is how i would do it

HTML

<div id="nH" class="nH" style="width:225px">
    <div class="nH"></div>
    <p>Stuffs</p>
</div>

if (document.all){ // IE Only
    var childNodes = document.all.nH.childNodes;
} else {
    var childNodes = document.getElementById('nH').childNodes;
}
    
if (childNodes != null){
    for(var i=0, max=childNodes.length; i<max; i++){
        if (childNodes[i].nodeName.toLowerCase() == 'div'){
            childNodes[i].style.display = 'none';
        }
    }
}

Hope that helps, it doesn’t include an argument for <p> but im sure you could work the rest out