change style to a group of elements

at one point I do:

// if bla bla show one of elements
document.getElementById("textA").style.visibility = 'visible';


How to set back css state as declared in below css. The aim is to hide back all elemnts as they were at start. Don't like idea finding them by id ...

css

#columnA div div
{
visibility:hidden;
}



<div id = "columnA">
<div>
<div id = 'textA'>
some text
</div>
<div id = 'textB'>
some text
</div>
<div id = 'textX">
....
</div>
</div>
</div>

One way is to loop through all div objects and set the style individually. Or assign a className to the div, say

document.getElementById("columnA").className = 'hidden';
div.hidden div div{
visibility:hidden;
}

<div id = "columnA" >
<div>
<div id = 'textA'>
some text
</div>
<div id = 'textB'>
some text
</div>
<div id = 'textX">
....
</div>
</div>
</div>
But this won't override the inline styles.

Your case:

var divs=document.getElementById("columnA").getElementsByTagName('div')[0].getElementsByTagName('div'), i=0, d;
while(d=divs[i++]){
d.style.visibility='hidden';
}