Add and remove multiple classes in jQuery

Question

I'm trying to add and remove multiple classes on a text field by clicking different radio buttons. I'm not able to remove the unwanted classes while switching between different radio buttons.

My code for this is:

// For 1st radio button
if (actionUrl == "search-client-by-id") {
    $("#req").removeClass("validate[required,custom[onlyLetterNumber],maxSize[20],custom[onlyLetterSp]]")
             .addClass("validate[required,custom[onlyNumberSp]]");
}
// For 2nd radio button
else if (actionUrl == "search-client-by-name") {    
    $("#req").removeClass("validate[required,custom[onlyNumberSp]]")
             .addClass("validate[required,custom[onlyLetterNumber],maxSize[20],custom[onlyLetterSp]]");
}

Answer 1

you can separate multiple classes with the space:

$("p").addClass("myClass yourClass");

http://api.jquery.com/addClass/

Answer 2

Add multiple classes:

 $("p").addClass("class1 class2 class3");

or in cascade

 $("p").addClass("class1").addClass("class2").addClass("class3");

Very similar also to remove more classes:

 $("p").removeClass("class1 class2 class3");

or in cascade

 $("p").removeClass("class1").removeClass("class2").removeClass("class3");

Answer 3

easiest way to append class name using javascript. It can be useful when .siblings() are misbehaving.

document.getElementById('myId').className += ' active';