juktastockJS Add/Remove Classes

stock: Colour Bubble

Add/Remove Classes for free Elements With Raw Javascript

Example click for free Elements:   css   js   See for Add/Remove for adjacent Elements

---

<box class="close" onclick="toggleClass('.code.css','open')">
    ..
</box>
		

box.close:after {
	content: '▼';
    padding: .2em 2em;
    line-height: 1em;
    font: 10 arial;
    cursor: pointer;
}
box.close.open:after {
	content: '▲';
}
		

function toggleClass(s, className) {
    var list = document.querySelectorAll(s);
    for(var el of list) {
        if (hasClass(el, className))removeClass(el, className)
        else addClass(el, className);
    }
}
function hasClass(el, className) {
    if (el.classList)
        return el.classList.contains(className)
    else
        return !!el.className.match(new RegExp('(\\s|^)' + className + '(\\s|$)'))
}
function addClass(el, className) {
    if (el.classList)
        el.classList.add(className)
    else if (!hasClass(el, className)) el.className += " " + className
}
function removeClass(el, className) {
    if (el.classList)
        el.classList.remove(className)
    else if (hasClass(el, className)) {
        var reg = new RegExp('(\\s|^)' + className + '(\\s|$)')
        el.className=el.className.replace(reg, ' ')
    }
}