How to remove the specific class, starts with "color" in jquery [duplicate]

Question

I want remove class, starts with "color". the classes are added dynamically i didn't know many class starts with color.

<div id="sample" class="color1 orange color2 color3 blue"></div>

Jquery

$("#sample").removeClass("[class^='color']");

But it doesn't work. Any Help?

Answer 1

Loop over all the classes and test if they begin with color.

var classes = $("#sample").attr("class").split(' ');
$.each(classes, function(i, c) {
    if (c.indexOf("color") == 0) {
        $("#sample").removeClass(c);
    }
});

Answer 2

This will work here

$('div')[0].className = $('div')[0].className.replace(/\bcolor.*?\b/g, '');

OR

 $('div').attr('class',$('div').attr('class').replace(/\bcolor.*?\b/g, ''));

Basically here I am getting each word in classes & replacing anything which starts with color.