¿Cómo puedo animar múltiples generadas dinámicamente elementos DOM?

Question

Esto puede ser útil para ver de donde soy.Jquery anidada cada problema

Estoy agregando divs para la página con este código:

jQuery("#list").append(
    jQuery("<div>")
        .attr("id", "Entry")
        .html(html)
);

html sólo es una cadena que contiene un texto y un ancla.

Estoy tratando de animar el nuevo divs - hay múltiples del div con el id #Entry.

Aquí está mi código:

jQuery("#Entry").hover(function(){  
    jQuery(this)
    .animate({
        width:"50%",
        fontSize: "30px",
        opacity: 0.3,
        borderwidth: "15px"
    }, 500);  
});

El de arriba es en mi jQuery(document).ready(function(){ } la función, si lo que importa.

Answer 1

Primero de todo, si va a agregar más de 1 <div> con ese id, lo están haciendo mal. id los atributos deben (debemos) ser ÚNICO en un documento.Tener más de 1 elemento con el mismo id hará Javascript ir de mal en peor porque no se suponía que debía suceder.Sería el equivalente de dos personas con el mismo número de seguridad social.:) La común y la mejor práctica cuando se trata de grupos de elementos es para darles a todos una clase y seleccione ellos de esa manera.

Más allá de eso, usted debe mirar en la live la función, que hace lo que quiere.Esencialmente, cuando se ejecuta un fragmento de código en su documento listo, está siendo ejecutado en contra de la actual estado del documento.En otras palabras, sólo los elementos que existen en ese punto en el tiempo (que coincide con el selector de siempre) será obligado para el caso de que usted proporciona.El live la función fue creado como una manera de conseguir alrededor de esto.Otra solución sería la de ejecutar el código de enlace de nuevo después de agregar una nueva <div>, pero que no es tan limpio como el que se acaba de usar live, que apoya la mouseover y mouseout los eventos que vamos a necesitar para hacer la hover.

Answer 2

live () admite todos los eventos, incluidos los eventos personalizados en la última versión de jQuery ...