Cacher is the code snippet organizer for pro developers

var myElement = document.querySelector("#superman");
myElement.style.backgroundColor = "#D93600";


var myElements = document.querySelectorAll(".bar");
 
for (var i = 0; i < myElements.length; i++) {
    myElements[i].style.opacity = 0;
}

function addClass(element, classToAdd) {
    var currentClassValue = element.className;
      
    if (currentClassValue.indexOf(classToAdd) == -1) {
        if ((currentClassValue == null) || (currentClassValue === "")) {
            element.className = classToAdd;
        } else {
            element.className += " " + classToAdd;
        }
    }
}
 
function removeClass(element, classToRemove) {
    var currentClassValue = element.className;
 
    if (currentClassValue == classToRemove) {
        element.className = "";
        return;
    }
 
    var classValues = currentClassValue.split(" ");
    var filteredList = [];
 
    for (var i = 0 ; i < classValues.length; i++) {
        if (classToRemove != classValues[i]) {
            filteredList.push(classValues[i]);
        }
    }
 
    element.className = filteredList.join(" ");
}

// To actually use these functions in an example, all you need to do is call addClass or removeClass, 
// pass in an argument for the element you want to affect, and pass in one more argument with the class name e.g., .

var theDropDown = document.querySelector("#dropDown");
addClass(theDropDown, "disableMenu");