// Sweep though all style sheets being applied, and toggle the supplied
// classes "display" on or off
// clsName - The name of the class to toggle visible/invisible
function ToggleVisible(clsName) {
  if (typeof(document.styleSheets) != 'undefined') {
    var i, j;
    var currSheet;
    var ruleType;
    var ruleSet;
    var currRule;
    var tmpStr;

    for(i = (document.styleSheets.length - 1); i>=0; i--) {
      currSheet = document.styleSheets[i];

      // Get array of rules:
      //   Microsoft browsers use "rules"
      //   W3C compliant browsers use "cssRules"
      if (typeof(currSheet.rules) != 'undefined') {
        ruleType = 'rules';
      } else {
        ruleType = 'cssRules';
      }
      
      if (typeof(currSheet[ruleType]) != 'undefined') {
        ruleSet = currSheet[ruleType];
        for(j = (ruleSet.length - 1); j>=0; j--) {
          currRule = ruleSet[j];
          if ('.'+clsName == currRule.selectorText) {
            // If "display: none" appears for the class, replace it with a
            // colon, otherwise, add "display: none" to the end.
            tmpStr = /display: none/i;
            if (currRule.style.cssText.match(tmpStr)) {
              currRule.style.cssText = currRule.style.cssText.replace(tmpStr, ';');
            } else {
              currRule.style.cssText += '; display: none;';
            }
            
            return;
          }
        }
      }
    }
  }

}