Toggle Class in RAW JavaScript when element is clicked (for menu purpose here)

toggleClassRawJS

function changeClass(elem,className1,className2){ 
  	elem.className = (elem.className == className1)?className2:className1;
	}

document.getElementById('menutoggle').onclick = function() {
	changeClass(this, 'navtoogle active', 'navtoogle');
}


// Many thanks to https://twitter.com/Martel_Louis

To make it work on Firefox, just use .setAttribute() & .getAttribute():

function changeClass(elem,className1,className2) { 
    elem.setAttribute('class', (elem.getAttribute('class') == className1)?className2:className1);
}

It's ok if we only have one class in className.

<div class='test1'> -> changeClass(this,'test1','test2) 
// class='test2'

<div class='test1 test3 test4'> -> changeClass(this,'test1','test2) 
// class='test2' => Where are test3 and test4 ?

To be more accurate :

var changeClass = function (r,className1,className2) {
    var regex = new RegExp("(?:^|\\s+)" + className1 + "(?:\\s+|$)");
    if( regex.test(r.className) ) {
        r.className = r.className.replace(regex,' '+className2+' ');
    }else{
        r.className = r.className.replace(new RegExp("(?:^|\\s+)" + className2 + "(?:\\s+|$)"),' '+className1+' ');
    }
    return r.className;
};

<div class='test1 test3 test4'> -> changeClass(this,'test1','test2) 
// <div class='test2 test3 test4'>  => ok

Fonctionne sous Firefox -> http://jsfiddle.net/5xBzF/