Evénement click sur plusieurs éléments créés dynamiquement

Bonsoir, je suis face à nouvel obstacle : comment écouter le clic sur un élément spécifique créé parmi n éléments créés dynamiquement.
Voici mon code:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
 
function retourAjax_25(data){ 
	var tab=data;
    //Si pas d"erreur
    if (tab["Erreur"]===1){
        //Compter nb éléments dans propriété Joueur du tableau de retour PHP
        var c = -1;
        for (var Joueur in tab) {
            if (tab.hasOwnProperty(Joueur)) ++c;
        }
        //Vider le div conteneur
        $(".espace_g2").empty();
 
 
        //Pour chaque joueur trouvé, une div ContAtt + i,  avec l'avatar, l'estimation de vie et pseudo 
        for (var i = 1; i <= c; i++) {
 
            $(".espace_g2").append("<div class='conteneurAtt' id='ContAtt" + i + "' > </div>");
 
           	$("#ContAtt" + i).css({
			    'margin-left' : '0px', 
			    'margin-up' : '10px' // marge extérieure de 10px
					});
 
           	$("#ContAtt" + i).append(
           		"<img src='" + tab[i]['AvatarJoueur'] + "'class='avatar' id='att" + i + "' height='60' width='60'>"); 
 
            $("#ContAtt" + i).append(
            	"<img src='" + tab[i]['imgEstiVieJoueur'] + "' class='vie' id=" + tab[i]['Joueur'] + " height='60' width='120'>"); 
 
            $("#ContAtt" + i).append(
            	"<div>" + tab[i]['PseudoJoueur'] + "</div>"); 
 
 
        }
 
    }
 
 
}

Comment faire pour savoir quel bloc cont & i a été cliqué ? Dois-je créer 50 événements écoutés sur clic ? Possible avec une boucle?
Besoin : connaitre quel bloc est cliqué me permettrait éventuellement d'avoir l'Id du joueur ciblé.

Code:

1
2
3
4
5
6
7
8
9
10
11
12
 
//S'il clique sur la barre de vie (classe vie avec comme identifiant l'ID du joueur ciblé) :
$(".ContAtt1").on("click",".vie",function(){
alert ("Joueur cible=" + $(this).attr('id');
}
$(".ContAtt2").on("click",".vie",function(){
alert ("Joueur cible=" + $(this).attr('id');
}
/...
$(".ContAtt50").on("click",".vie",function(){
alert ("Joueur cible=" + $(this).attr('id');
}

Je sens que le méconnu (de moi) $this peut aider, non?
Sans me donner la solution, pourriez-vous me dire vers quoi orienter ma recherche?
J'ai cru voir une "ancienne" méthode bind?

Salut,

Dans l'ancienne discussion, tu as corrigé le code de clic sur les .conteneurAtt comme ça :
Code:

1 2 3 4 $(".espace_g2").on("click",".conteneurAtt",function(e){ //le code que tu veux exécuter .... });
Mais maintenant tu veux attacher un événement clic à un élément enfant .vie de .conteneurAtt.
Oublis le code de (50 fois parce qu'il n'a aucun sens...) et modifie le code comme suite :
Code:

1 2 3 4 5 6 7 8 9 $(".espace_g2") .on("click",".conteneurAtt",function(){ console.log("click sur la classe :"+$(this).attr('class')+" ayant le id :"+$(this).attr("id")); }) .on("click",".conteneurAtt .vie",function(e){ e.stopPropagation(); console.log("click sur "+$(this).attr("class")+" qui est un enfant de "+$(this).parent().attr("id")); });
Voir stopPropagation.

Top, ça fonctionne, je regarde plus en détail cet aprem.
Merci encore!