Asignar clases con JQuery dinamicamente

[jluisfg]

Hola, tengo un código similar al siguiente

Código HTML:

<div>Contenido</div>
<div>Contenido</div>
<div>Contenido</div>
<div>Contenido</div>
<div>Contenido</div>
<div>Contenido</div> 

Será un blog, por lo que cada div que ven ahí se generará dinámicamente. Mi pregunta es: ¿Hay manera con JQuery de asignar clases dinamicamente para que quede así:

Código HTML:

<div class="uno">Contenido</div>
<div class="dos">Contenido</div>
<div class="tres">Contenido</div>
<div class="uno">Contenido</div>
<div class="dos">Contenido</div>
<div class="tres">Contenido</div> 

Espero darme a entender y que alguien sepa como hacer esto

[Trublux]

El problema es poner la clase "uno", "dos", etc. Se podría hacer para unos cuantos, pero si pueden ser infinitos "div"...

Una forma sería la siguiente, aunque en este caso les pondríamos la clase "nombre-clase+número de div":

Código Javascript:

$(function(){
    $('div').each(function(indice){
        //console.log(indice);
        $(this).addClass( 'clase-' + indice );
    });
});
 

En este caso los div resultantes serían así:

Código HTML:

<div class="clase-0">Contenido</div>
<div class="clase-1">Contenido</div>
<div class="clase-2">Contenido</div>
<div class="clase-3">Contenido</div>
<div class="clase-4">Contenido</div>
<div class="clase-5">Contenido</div>
 

Si quisieras poner la clase "uno", "dos", etc. Podrías poner:

Código Javascript:

if ( indice == 0 )
clase="uno";
elseif(indice==1)
clase="dos";
...
 

Pero de esa forma tendrías que poner muchas condiciones, es mejor poner un texto más un número.

Ten en cuenta que de esta forma estás cogiendo todos los "div" de la web, lo mejor que puedes hacer es meterlos dentro de otra capa y coger sólo los "div" que estén dentro de esa capa.

[jluisfg]

Iniciado por Trublux

El problema es poner la clase "uno", "dos", etc. Se podría hacer para unos cuantos, pero si pueden ser infinitos "div"...

Una forma sería la siguiente, aunque en este caso les pondríamos la clase "nombre-clase+número de div":

Código Javascript:

$(function(){
    $('div').each(function(indice){
        //console.log(indice);
        $(this).addClass( 'clase-' + indice );
    });
});
 

En este caso los div resultantes serían así:

Código HTML:

<div class="clase-0">Contenido</div>
<div class="clase-1">Contenido</div>
<div class="clase-2">Contenido</div>
<div class="clase-3">Contenido</div>
<div class="clase-4">Contenido</div>
<div class="clase-5">Contenido</div>
 

Si quisieras poner la clase "uno", "dos", etc. Podrías poner:

Código Javascript:

if ( indice == 0 )
clase="uno";
elseif(indice==1)
clase="dos";
...
 

Pero de esa forma tendrías que poner muchas condiciones, es mejor poner un texto más un número.

Ten en cuenta que de esta forma estás cogiendo todos los "div" de la web, lo mejor que puedes hacer es meterlos dentro de otra capa y coger sólo los "div" que estén dentro de esa capa.

Muchas gracias, creo que si era algo parecido. Aquí les dejo como lo hice por si alguien tiene mi mismo problema :D

Código HTML:

var i = 1;
    $("#herramientas").find("h2.trigger").each(function(){
        $(this).addClass("herramienta_"+i);
        if (i <= 4) {
        		i += 1;
        	}
        	else {
        		i = 1;
        	}