Cyril
Cyril

Reputation: 123

Jquery adding a class to div with no class name

I have the following markup:

<body id="terms_and_conditions_page" dir="ltr">
 <div class="main-wrapper"></div> <---------*  Edit
 <div> <-------*
     <div class="page_banner describes_page_content body-bg"></div>
     <div class="content-bg"></div>
 </div>
</body>

and I am trying to add a class (tc-content) to a div with no class name so the markup will look like:

<body id="terms_and_conditions_page" dir="ltr">
 <div class="main-wrapper">
 <div class="tc-content"> <-------*
     <div class="page_banner describes_page_content body-bg"></div>
     <div class="content-bg"></div>
 </div>
</body> 

I tried $('#terms_and_conditions_page:nth-child(2)').addClass('tc-content'); but it adds a class to every child of this empty div. Is there an easy way to do it ?

Edit: sorry guy, I copied that from firebug so it skipped the closing div. See the edit

Upvotes: 0

Views: 217

Answers (8)

Simone Gianni
Simone Gianni

Reputation: 11662

There are many :

 1. #terms_and_conditions_page>*:nth-child(2)
 2. $('.main-wrapper').next()
 3. $('.page_banner').parent()

Upvotes: 2

ShankarSangoli
ShankarSangoli

Reputation: 69905

Try this

$("div.page_banner").parent().addClass("tc-content");

Upvotes: 0

Jasper
Jasper

Reputation: 75993

$('#terms_and_conditions_page > div > div:first').addClass('tc-content');

The div you want to select is the child of a child of the body tag, not a direct child of the body tag. With the exact markup you don't really need the ':first' that I put in the selector since there is only one div in that tier.

...which means there is an un-closed div tag in your markup:

<body id="terms_and_conditions_page" dir="ltr">
 <div class="main-wrapper">
 <div> <-------*
     <div class="page_banner describes_page_content body-bg"></div>
     <div class="content-bg"></div>
 </div>
</body>

Should be:

<body id="terms_and_conditions_page" dir="ltr">
 <div class="main-wrapper">
  <div> <-------*
     <div class="page_banner describes_page_content body-bg"></div>
     <div class="content-bg"></div>
  </div>
 </div>
</body>

Upvotes: 0

karim79
karim79

Reputation: 342635

It seems like .main-wrapper should be the parent div? Try:

$(".main-wrapper > div").eq(0).addClass("tc-content");

Upvotes: 0

Rafay
Rafay

Reputation: 31033

use :not

here is the fiddle http://jsfiddle.net/r89Sa/1/

Upvotes: 1

DanyZift
DanyZift

Reputation: 687

try this:

$('.main-wrapper').next().addClass('tc-content');

Upvotes: 1

Joseph Marikle
Joseph Marikle

Reputation: 78520

$("#terms_and_conditions_page div:not([class])").attr("class","tc-content")

Will work

Upvotes: 0

codecraftnap
codecraftnap

Reputation: 1553

Is it just one div? Assign an id to it, and then you can get the element by id and add the class to it.

Upvotes: 0

Related Questions