Problem with hiding and showing classes

Hi I have the following code that don’t work like i want it.


function hideDisplaySingleSuite(textstring) {
var myclass1 = new RegExp('\\\\b'+textstring+'\\\\b');
//Populate the array with all the page tags
var allPageTags=document.getElementsByTagName("*");
//Cycle through the tags using a for loop
for (i=0; i<allPageTags.length; i++) {
//Pick out the tags with our class name
if (myclass1.test(allPageTags[i].className)) {
if (allPageTags[i].style.display == ''){
	allPageTags[i].style.display = 'none';
}
else{
allPageTags[i].style.display = '';
}



}
}
}

For example

It show objects if I remove the if statement that checks if the class is visible.

for example this shows a class and works.


function hideDisplaySingleSuite(textstring) {
var myclass1 = new RegExp('\\\\b'+textstring+'\\\\b');
//Populate the array with all the page tags
var allPageTags=document.getElementsByTagName("*");
//Cycle through the tags using a for loop
for (i=0; i<allPageTags.length; i++) {
//Pick out the tags with our class name
if (myclass1.test(allPageTags[i].className)) {

allPageTags[i].style.display = '';

}
}
}

So my question is why don’t this work on a class, it works on an “id”?

if (allPageTags[i].style.display ==''){
	allPageTags[i].style.display = 'none';
}
else{
allPageTags[i].style.display = '';
}

I want to show the class if its not visible or hide it if it is visible.
How can this be done?

Thanks :slight_smile:

Wow thanks.

I have another quastion(sorry for not dropping this but i just want to know one thing about my function).

function hideDisplaySingleSuite(textstring) {
var myclass1 = new RegExp('\\\\b'+textstring+'\\\\b');
//Populate the array with all the page tags
var allPageTags=document.getElementsByTagName("*");
//Cycle through the tags using a for loop
for (i=0; i<allPageTags.length; i++) {
//Pick out the tags with our class name
if (myclass1.test(allPageTags[i].className)) {
/*if (allPageTags[i].style.display == '')
	allPageTags[i].style.display='none';*/
[B][I]if[/I][/B](allPageTags[i].style.display == 'none')
allPageTags[i].style.display='';
[B][I]else[/I][/B]
allPageTags[i].style.display='none';




}
}
}

I know whats the problem with the above function, both the if and the else statement is executed, meaning that first it shows the rows and them hides them, thats why i thought that it didn’t work, but it does…kind of :P. Do you know how come?

I have never before experienced this type of “error” where both an if and an else statement is executed :stuck_out_tongue:

Ok, so how can I check if a class is “display==‘none’” or “display==‘’”? :slight_smile:

http://www.javascriptkit.com/dhtmltutors/externalcss3.shtml

although I would probably set up an array of classStates to remember it for me

ClassStates=new Array(0,0,0)

Too much work. Research cssRules or stylesheet changers. You no longer need to iterate through every element on your page :slight_smile:
Also, a stylesheet changer can be noscript as well if done with server side languages