Combiner un sélecteur de classe et un sélecteur d'attribut avec jQuery

Est-il possible de combiner à la fois un sélecteur de classe et un sélecteur d'attribut avec jQuery?

Par exemple, étant donné le code HTML suivant:

<TABLE>
  <TR class="myclass" reference="12345"><TD>Row 1</TD></TR>
  <TR class="otherclass" reference="12345"><TD>Row 2</TD></TR>
  <TR class="myclass" reference="12345"><TD>Row 3</TD></TR>
  <TR class="myclass" reference="54321"><TD>Row 4</TD></TR>
</TABLE>

Quel serait le sélecteur que je peux utiliser pour sélectionner uniquement les lignes 1 et 3?

J'ai essayé:

$(".myclass [reference=12345]") // returns nothing

$(".myclass, [reference=12345]") // returns all 4 rows (yes, I know the comma means 'or')

Je suis sûr que la réponse est très simple et j'ai essayé de rechercher les forums et la documentation jQuery, mais je n'arrive pas à comprendre celui-ci. Quelqu'un peut-il aider?

Combinez-les. Combinez- les littéralement ; attachez- les ensemble sans aucune ponctuation.

$('.myclass[reference="12345"]')

Votre premier sélecteur recherche les éléments avec la valeur d'attribut, contenus dans les éléments avec la classe.
L'espace est interprété comme le sélecteur descendant .

Votre deuxième sélecteur, comme vous l'avez dit, recherche les éléments avec la valeur d'attribut, ou la classe, ou les deux.
La virgule est interprétée comme l' opérateur de sélecteur multiple - quoi que cela signifie (les sélecteurs CSS n'ont pas de notion d '«opérateurs»; la virgule est probablement plus précisément connue sous le nom de délimiteur).

Je pense que vous avez juste besoin de supprimer l'espace. c'est à dire

$(".myclass[reference=12345]").css('border', '#000 solid 1px');

Il y a un violon ici http://jsfiddle.net/xXEHY/

Ce code fonctionne aussi:

$("input[reference=12345].myclass").css('border', '#000 solid 1px');

Cela fonctionnera également:

$(".myclass[reference='12345']").css('border', '#000 solid 1px');