jQuery: Syntax error, unrecognized expression: .Marketing&Communications

Question

I'm using jQuery to add a class name to an element, but when the class name contains special characters like '&', or '/', it throws the error seen below:

function cleanString(string) {
  if (string) {
    var cleanString = string.replace(/\s+/ig, "");
    return cleanString;
  }
  else {
    return "Uncategorized";
  }
}

var team = nullCheck(_data[i].title)
var teamCleanString = cleanString(team);
$('#jobs-container .jobs-teams').append(
    '<a href="#" class="btn '+teamCleanString+'">'+team+'</a>'
  );
}

Produces this:

Uncaught Error: Syntax error, unrecognized expression: .Marketing&Communications

What is the code of the `cleanString` function? What line of your code returns the error? — litel, Apr 18 '16 at 20:20
You can change the `\s+` in your `replace` regex to `\W+` if you want to remove the `&`. — litel, Apr 18 '16 at 20:43

score 2 · Answer 1 · edited May 23 '17 at 11:45

2

There are certain characters that have functionality that are not valid for naming CSS selectors without escaping.

Which characters are valid in CSS class names/selectors?

You can use these special characters in naming if you perform proper escaping.

https://mathiasbynens.be/notes/css-escapes

Try using .Marketing\&Communications

edited May 23 '17 at 11:45

Community

1
1

answered Apr 18 '16 at 20:39

Mauin

35
7

jQuery: Syntax error, unrecognized expression: .Marketing&Communications

1 Answers1