jquery addclass to body tag

jquery addclass

27,482

Solution 1

I understand that you are viewing the html source to check body class you added. DOM manipulation with javascript is not visible in source code, but you can check it with Developer Tools in your browser(Chrome, Firefox and IE have one).

Solution 2

Your code is perfectly correct since $('body') will search the whole DOM

Solution 3

No problem with script. Diary class will apply to body. Can you share you diary class and please check that jQuery is loaded correctly, use any development tool like firebug.

Add jQuery file in your page like following where Scripts is folder and jQuery.js is jQuery file. If you already included this in your page then check with any developer tool that it is loading correctly.

<script src="Scripts/jQuery.js" type="text/javascript"></script>

Or add from CDN

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>

Solution 4

Your code looks fine. Check here, http://jsfiddle.net/muthkum/P5uS2/. Use FireBug or Chrome Inspector to check the <body> tag.

Make sure you included jquery file.

View more solutions

27,482

Author by

Pete Norris

Updated on November 13, 2020

Comments

Pete Norris over 3 years

The following script is within a div, does this matter? As it doesn't work. Is the syntax right? Do I need to tell jquery to go up a level in the DOM first? how would I do this?

        $(document).ready(function() {
          $('body').addClass('diary');
        });

Thanks guys.

Here is the relevant section in the HTML:

<body>

  <header>
    <div class="logo">
      <a href=""></a>
    </div>  
    <nav class="main-nav">
      <a class="first" href="http://www.adrianwaddingham.com">HOME</a>
      <a class="second" href="/sheriff">SHERIFF</a>
      <a class="third" href="/biography">BIOGRAPHY</a>
      <a class="fourth" href="/contact">CONTACT</a>     
      <a class="fifth" href="/diary">DIARY</a>     

    </nav>

  </header>

<script>
        $(document).ready(function() {
          $('body').addClass('diary');
        });    
</script>


<section class="copy-main">
  <article>