Evénement de clic sur un élément dynamique SANS jQuery

Question

Je voudrais ajouter un événement tel que onclick ou mouseover à un élément créé dynamiquement (similaire à la fonction .live dans jQuery) ... comment faire ceci en utilisant du javascript pur sans framework comme jQuery? Voici un simple jsFiddle http://jsfiddle.net/3tBpv/1/

Je voudrais être en mesure de le faire à partir de la classe divs nouvellement créée au lieu d'un ID.

Toute aide serait grandement appréciée

Answer 1

Créer un gestionnaire sur l'objet du document. Vérifiez la classe et le nom de noeud de l'élément cible (balise). S'ils correspondent, continuez avec tout ce qui doit être fait, sinon ignorez le clic.

document.onclick = function(event) { 
    var el = event.target; 
    if (el.className == "new" && el.nodeName == "DIV") { 
     alert("div.new clicked"); 
    } 
}; 

Voici un fiddle.

Answer 2

@Anurag's answer est correct mais pas complet et dans la plupart des cas entraînera beaucoup de bogues d'intégration.

Voici la version correcte:

document.addEventListener("click", function(event) 
{ 
    // retrieve an event if it was called manually 
    event = event || window.event; 

    // retrieve the related element 
    var el = event.target || event.srcElement; 

    // for all A tags do the following 
    if (el instanceof HTMLAnchorElement) 
    { 
     //required to make the "return false" to affect 
     event.preventDefault(); 

     window.location.href = "/click.php?href="+encodeURIComponent(el.href); 

     //prevent user's click action 
     return false; 
    } 
}, true); 

Ceci est une fonctionnalité clic-trace de base affecte tous les liens sur la page pour tracer/enregistrer tous les clics de lien.