JQuery to add <body> class, need a little more help

javascript jquery theming
Danny Englander picture Danny Englander · Nov 9, 2011 · Viewed 8.3k times · Source

I have this snippet of code to parse the URL and add a class to the <body>tag of my HTML page. 

var pathname = window.location.pathname;
var pathSlashesReplaced = pathname.replace(/\//g, " ");
var pathSlashesReplacedNoFirstDash = pathSlashesReplaced.replace(" ","");
var newClass = pathSlashesReplacedNoFirstDash.replace(/(\.[\s\S]+)/ig, "");

$("body").attr("class",newClass);
if ( $("body").attr("class") == "")
{
$("body").addClass("class");
}

The issue I am having is that it deletes existing body classes already there. Instead, I would like to append to whatever body classes exist and not overwrite.

Answer

Smamatti picture Smamatti · Nov 9, 2011

Use this:

$("body").addClass(newClass);

instead of

$("body").attr("class",newClass);

This is a setter: $("body").attr("class",newClass); which sets the class to the newClass and does not append it.

Related questions

JQuery .addclass to table <tr> element where text is found

I am theming some report tables and do not have access to the templates. I have this code so far which ends up adding "my-class" to every TR element in the report table. However, I only want to add the …

Read More
How do I redirect to another webpage?

How can I redirect the user from one page to another using jQuery or pure JavaScript?

Read More
Why does my JavaScript code receive a "No 'Access-Control-Allow-Origin' header is present on the requested resource" error, while Postman does not?

Mod note: This question is about why Postman is not subject to CORS restrictions in the same way an XMLHttpRequest is. This question is not about how to fix a "No 'Access-Control-Allow-Origin'..." error. Please stop posting: CORS configurations for every …

Read More