Targeting every 3rd, 6th, 9th etc element of a list with Jquery

I want to target these element for my 3 collumn portfolio page and I did something like this :

jQuery('.page-template-portfolio-full-php #portfolioItem li:nth-child(3n)').css({ marginRight: '0px'});
        jQuery('.page-template-portfolio-full-php #portfolioItem li:nth-child(6n)').css({ marginRight: '0px'});
         jQuery('.page-template-portfolio-full-php #portfolioItem li:nth-child(9n)').css({ marginRight: '0px'});
          jQuery('.page-template-portfolio-full-php #portfolioItem li:nth-child(12n)').css({ marginRight: '0px'});

I know it’s not the best way and I know I could do something like i++ or something but im not sure exactly what it is ..

I want to do the same thing for the 2 collumn .. only this time target every 2nd, 4th, 6th element etc etc ..

How is it done?

Thanks guys!

Hi DD

I think it’s easier with i++ you can do it this way:

$counter =0;

query_posts  <--- your normal query

if ( have_posts() )  ,etc. you know the rest

++$counter;
      if($counter == 3) {
        $postclass = 'last';
        $counter = 0;
      } else { $postclass = ''; }

<li class="&lt;?php echo $postclass; ?&gt;">
       your code.....
</li>

This will add the class last to every 3rd, 6th, 9th, etc elements. and then you just need your css.

.last{margin-right: 0 !important;}

Edit: Ivor was faster

Love this tool: http://css-tricks.com/examples/nth-child-tester/

Damn, I knew it was simple

Thanks my friend.

Ivor said
Mine is a single line

Man i need to learn more about jQuery

jQuery('#portfolioItem').find('li').each(function(i,e){
   if(!i%3) $(e).css({ marginRight: '0px' });
});

The child selector isn’t good for large list. The id selecter is the fastest and the find method is fast too.

Far better is to assign a class which is slightly faster than the css:

jQuery('#portfolioItem').find('li').each(function(i,e){
   if(!i%3) $(e).addClass('last');
});

Anyway, I recommend the latest jquery version but at least 1.4.4.

jQuery('#portfolioItem').find('li').each(function(i,e){if(!i%3)$(e).addClass('last');});