Utiliser jQuery pour appliquer un style à toutes les occurrences de l'élément cliqué

Question

Ce que je veux, c'est que jQuery regarde l'élément sur lequel je viens de cliquer (par exemple ap ou une balise li), puis applique un style à tous instances de cet élément (donc toutes les balises p sur la page).

Ceci est mon code jusqu'à présent, mais il applique uniquement le style à l'élément unique qui a été cliqué.

$("article *", document.body).click(function (e) { 
    e.stopPropagation(); 
selectedElement = $(this); 
$(selectedElement).css("border", "1px dotted #333") 
}); 

Nous souhaiterions recevoir de l'aide ou des conseils!

Answer 1

$('article *',document.body).click(
function(e){ 
    e.stopPropagation(); 
    var selectedElement = this.tagName; 
    $(selectedElement).css('border','1px dotted #333'); 
} 
); 

Demo à JS Bin, mais je l'ai utilisé le sélecteur universel (puisque je ne posté deux listes (un autre un ol un ul).

code ci-dessus modifié en réponse aux commentaires de @Peter Ajtai, et lié JS Bin démo mis à jour pour refléter le changement:

Pourquoi courir autour du bloc une fois avant de vous regardez le tagName Que diriez-vous var = selectedElement this.tagName ;. il est aussi e?. stopPropagation(), puisque vous appelez un metho ré.

Answer 2

Je ne sais pas combien d'éléments sont imbriqués sous vos article éléments, mais il semble inutile d'ajouter des gestionnaires d'événements de clic pour tout de les utiliser *.

Au lieu de cela, il suffit d'ajouter le gestionnaire à article et d'obtenir le tagName du e.target sur lequel vous avez cliqué.

$("article", document.body).click(function (e) { 
    e.stopPropagation(); 
    $(e.target.tagName).css("border", "1px dotted #333") 
}); 

Ce sera beaucoup plus efficace.