Add class to every third div?

[greencode]

I'm currently using this code to add a class of "last" to the last list item in any list but what I am now trying to do is to add the class of "last" to every third div block that I have in a containing div. For example I have a grid of 3 by 3 and so the last div in each of those three rows I would like to have zero right margin.

The code I used for the list item was this:

$(document).ready(function() {
$("li:last-child").addClass("last");
});

But I've not idea where to start with the code for every third div!

[coopster]

How about nth-child [api.jquery.com]?

$("div div:nth-child(3)").addClass('last');

[greencode]

Thanks for this - am I right in thinking though that this is only from IE9?

[coopster]

No, should work cross-browser, without issue. jQuery programmers (and other open-source contributors) ensure this for you.

[greencode]

Arh, I didn't know that. I shall give this a go tomorrow when I'm less tired! Just to clarify what do I enter as each of the "div"s in your example

$("div div:nth-child(3)").addClass('last');

Do I enter the containing div name and then the div block I'm wanting to add the class to so it looks like this:

$(".divcontainer .divblock:nth-child(3)").addClass('last');

Thanks for your help with this - very much appreciated.

[coopster]

You need to read up on selectors. jQuery "mimics" id and class attribute selectors to determine which elements you are targeting. Let's say I have 5 separate <div>s in my html, and within those 5 div elements I have 10 divs each. The code I offered would add the class of "last" to the 3rd div within each of the 5 "parent" div containers.

The way you have it written now would require you to have a class of "divcontainer" on your 5 parent containers (<div>, <p>, etc.) and a class of "divblock" for any containers within them. You can read up on jQuery Selectors [api.jquery.com] for more information.

[greencode]

Thanks again

[coopster]

You're welcome. I hope that made sense ;)

[greencode]

Just to let you know I added this to my custom js file so that any third div within it's containing div with ID of "results" and class of "grid" will be given a class of "last".

$("#results.grid div:nth-child(3n)").addClass('last');

Just in case anyone else needs to know.