css3 nth de tipo restringido a la clase

Question

¿Hay alguna manera de limitar el nth-of-type de css3 a una clase? Tengo un número dinámico de elementos section con diferentes clases que indican sus necesidades de diseño. Me gustaría obtener cada 3 .module, pero parece que nth-of-type busca el tipo de elemento de clases y luego calcula el tipo. En cambio, me gustaría limitarlo a solo .module s.

Gracias!

jsFiddle para demostrar: http://jsfiddle.net/danielredwood/e2BAq/1/

HTML:

<section class="featured video"> 
    <h1>VIDEO</h1> 
</section> 
<section class="featured module"> 
    <h1>NOT A VIDEO</h1> 
</section> 
<section class="featured module"> 
    <h1>NOT A VIDEO</h1> 
</section> 
<section class="featured module"> 
    <h1>NOT A VIDEO (3)</h1> 
</section> 
<section class="featured module"> 
    <h1>NOT A VIDEO</h1> 
</section> 
<section class="featured module"> 
    <h1>NOT A VIDEO</h1> 
</section> 
<section class="featured module"> 
    <h1>NOT A VIDEO (6)</h1> 
</section> 

CSS:

.featured { 
    width:31%; 
    margin:0 0 20px 0; 
    padding:0 3.5% 2em 0; 
    float:left; 
    background:#ccc; 
} 
    .featured.module:nth-of-type(3n+3) { 
    padding-right:0; 
    background:red; 
    } 
    .featured.video { 
    width:auto; 
    padding:0 0 2em 0; 
    float:none; 
    }​ 

Answer 1

Desafortunadamente, no hay manera (al menos ninguno que conozco) para seleccionar nth-of-type de una clase, ya que nth-of-class no existe. Es probable que deba agregar una nueva clase a cada tercer .module manualmente.

Answer 2

Parece que lo que realmente quiere es la css4 :nth-match selector, pero en realidad no es compatible con la mayoría de navegadores, sin embargo, por lo que en la actualidad, la única manera de hacerlo es con javascript

$(".featured.module").filter(function(index, element){ 
    return index % 3 == 2; 
}).addClass("third"); 

http://jsfiddle.net/w3af16dj/