Question

I want .fourth added to the fourth .service-list when its inside:

 <section class="sixteen">

When it’s any other class I want to add .third to the third .service-list.

e.g

 if ($("section").hasClass("sixteen")) {

     $('div.service-list').filter(function(index){
     return (index%4 == 3);
     }).addClass('fourth');

 } else {

     $('div.service-list').filter(function(index){
     return (index%3 == 2);
     }).addClass('third');
 }

However this seems to find ANY .sixteen on the page. I just want it to check the parent of the .service-list’s.

At the moment is finds another .sixteen down the page and adds .fourth when I need .third because it’s inside a smaller grid.

Here is a jsFiddle: http://jsfiddle.net/Xu3Yq/

Answer 1

How about this:

$('section')​​​​​​​.each(function() {
    var $this = $(this);

    if ($this.hasClass('sixteen')) {
        $this.find('div.service-list:eq(3)').addClass('fourth');
    } else {
        $this.find('div.service-list:eq(2)').addClass('third');
    }
});​

http://jsfiddle.net/mzwqD/