Agregando animación CSS con retraso a cada elemento de la lista [duplicado]

Question

Jun 23, 2012, 12:54 AM

Agregando animación CSS con retraso a cada elemento de la lista [duplicado]

Esta pregunta ya tiene una respuesta aquí:

Cómo hacer que cada etiqueta <li> aparezca lentamente una tras otra 1 respuesta

Estoy tratando de escribir algo de jquery que pasará por un elemento de lista / dom desordenado especificado y asignará una clase CSS (animación) a cada elemento de lista / hijo. También quiero hacer un tiempo de retraso ajustable entre .addClass.

Todo lo que he intentado ha fallado miserablemente.

Por ejemplo

<ul>
   <li>Item 1</li>
   <li>Item 2</li>
   <li>Item 3</li>
   <li>Item 4</li>
</ul>

Becomes:

<ul>
   <li class="animation">Item 1</li>
     (50ms delay)
   <li class="animation">Item 2</li>
     (50ms delay)
   <li class="animation">Item 3</li>
     (50ms delay)
   <li class="animation">Item 4</li>
     (50ms delay)
</ul>

¿Alguna idea