How to remove a single class only in Javascript using Regex?

Question

(Pure javascript only, please!)

I want to create a helper function that removes a single class from a div with several classes. I'm imagining a function as follows:

function remove_class(div, klass) {
    div.className = div.className.replace( /(?:^|\s)active(?!\S)/ , '' );
}

The class removed here is active. However, how can I remove any class name, ie. one passed as the klass variable?

Why not use [`classList`](https://developer.mozilla.org/en-US/docs/Web/API/element.classList)? The MDN page even has a [shim](https://developer.mozilla.org/en-US/docs/Web/API/element.classList#wrapper) for browser compatibility — Phil, Sep 30 '13 at 01:27
Limited compatibility is why. :) And this is not a duplicate - it's a much more specific question. — knutole, Sep 30 '13 at 01:35
It's compatible down to IE8 with the shim. And yes, this question is an **exact** duplicate of the other one. The answers are the same too — Phil, Sep 30 '13 at 01:38
No it isn't, because I didn't understand the other answers. I've looked it over several times, in fact. The answer I got here was easy to understand. So thanks for voting to close this question, on behalf of other to come after me. — knutole, Sep 30 '13 at 01:40
No offense, but I think there is a misunderstanding. If the answers are not easy to understand it is not advisable to duplicate the question. Instead you can ask your question as a comment at the initial question. So Phil is right and you have duplicated the question. — Lajos Arpad, Sep 30 '13 at 13:15

score 4 · Accepted Answer · answered Sep 30 '13 at 01:27

4

Use the RegExp constructor instead of a RegExp literal. The constructor takes a string as its first param, so you can build it any way you like.

function remove_class(div, klass) {
    div.className = div.className.replace( new RegExp('(?:^|\\s)' + klass + '(?!\\S)'), '' );
}

Notice that no delimiters (the leading and trailing forward slashes) are needed when using the constructor.

answered Sep 30 '13 at 01:27

JAAulde

19,250
5
52
63

I have never used RegExp constructor. Do you have a working example? – knutole Sep 30 '13 at 01:28
Sorry, it was coming. – JAAulde Sep 30 '13 at 01:28

score 1 · Answer 2 · answered Sep 30 '13 at 01:29

1

Instead using /regexp/ syntax you can use RegExp: something like this:

function remove_class(div, klass) {
    var regex = new RegExp('\/(?:^|\\s)' + klass + '(?!\\S)\/');
    div.className = div.className.replace( regex , '' );
}

answered Sep 30 '13 at 01:29

Alexander Kobelev

1,379
8
14

1

Note, the RegExp delimiters (leading and trailing forward-slash) are only needed for a RegExp literal. – JAAulde Sep 30 '13 at 01:31

score 1 · Answer 3 · edited May 23 '17 at 11:57

1

You can create the regexp like so:

var re = new RegExp("regex","g");

Check out https://stackoverflow.com/a/494046/1778812

edited May 23 '17 at 11:57

Community

1
1

answered Sep 30 '13 at 01:33

colinwren

29
1
2

If this question was a duplicate, you should have flagged it as such – Phil Sep 30 '13 at 01:36
@Phil rep not high enough to vote-to-close. (Copying answers between questions is still stupid.) – Evan Davis Sep 30 '13 at 01:43
Is there a single answer in so-called duplicate with the syntax of the accepted answer to this question? `new RegExp('(?:^|\\s)' + klass + '(?!\\S)'), '' ` No. – knutole Sep 30 '13 at 01:49

How to remove a single class only in Javascript using Regex?

3 Answers3