How to add and remove a class from the body when clicking on an element?

Question

JavaScript

How can I use jQuery to add a class to the body when clicking on a certain element (block, button or link), and remove it when clicked again?

I found one script here on the Toaster:

(function() {
  var $body = document.body,
    $nav - icon = $body.getElementsByClassName('nav-icon')[0];

  if (typeof $nav - icon !== 'undefined') {
    $nav - icon.addEventListener('click', function() {
      $body.className = ($body.className == 'nav-active') ? '' : 'nav-active';
    });
  }
}).call(this);

In theory, this is exactly what he should do, but for some reason it does not work.

Instead, for this line:

$nav - icon = $body.getElementsByClassName('nav-icon')[0];

gives an error: "Uncaught SyntaxError: Unexpected token -".

Answer 1

$("div").click(function(){
   $("body").toggleClass("class");
});

The brain would also give an error for something like that.
If you tried to name a variable like that, then logically it would be necessary to write it together. Although, all the same, it will not work, because you cannot use minuses (they are dashes and hyphens) in the name of variables, like many other characters .

Answer 2

late)

$("block").click(function(event) {
  $("body").toggleClass('someclass');
});

Answer 3

It's funny. A variable with spaces and minuses or pluses cannot be used. Replace last line with

$navicon = $body.getElementsByClassName('nav-icon')[0];