var allHTMLTags = new Array();
//Create Array of All HTML Tags
var allHTMLTags=document.getElementsByTagName('*');

// This function will insure that only one section is visible at once.
function switchOnly(theClass){
   if(theClass != 'bagstyle') switchOff('bagstyle');
   if(theClass != 'logostyle') switchOff('logostyle');
   if(theClass != 'fabricstyle') switchOff('fabricstyle');
   if(theClass != 'trimstyle') switchOff('trimstyle');
   if(theClass != 'hardwarestyle') switchOff('hardwarestyle');
   switchOn(theClass);
}

// This function switches the visibility of "theClass" between visible and none.
function switchVisibility(theClass) {

  //Loop through all tags using a for loop
  for (i=0; i<allHTMLTags.length; i++) {

    //Get all tags with the specified class name.
    if (allHTMLTags[i].className.indexOf(theClass) != -1 && allHTMLTags[i].className.indexOf('designyourbag') == -1) {

      //Place any code you want to apply to all
      //pages with the class specified.
      //In this example is to “display:none;' them
      //Making them all dissapear on the page.
      if(allHTMLTags[i].style.display == 'none'){
        allHTMLTags[i].style.display='inline-block';
      }
      else{ 
        allHTMLTags[i].style.display='none';
      }
    }
  }
}

function switchOff(theClass){
  //Loop through all tags using a for loop
  for (i=0; i<allHTMLTags.length; i++) {

    //Get all tags with the specified class name.
    if (allHTMLTags[i].className.indexOf(theClass) != -1) {

     allHTMLTags[i].style.display='none';

    }
  }
}

function switchOn(theClass){
  //Loop through all tags using a for loop
  for (i=0; i<allHTMLTags.length; i++) {

    //Get all tags with the specified class name.
    if (allHTMLTags[i].className.indexOf(theClass) != -1) {

     allHTMLTags[i].style.display='inline-block';

    }
  }
}