Combinando um seletor de classe e um seletor de atributo com jQuery

É possível combinar um seletor de classe e um seletor de atributos com o jQuery?

Por exemplo, dado o seguinte HTML:

<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>

Qual seria o seletor que eu posso usar para selecionar apenas as linhas 1 e 3?

Eu tentei:

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

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

Tenho certeza de que a resposta é muito simples e tentei pesquisar nos fóruns e na documentação do jQuery, mas não consigo entender isso. Alguém pode ajudar?

Combine-os. Literalmente combinar -los; anexá- los juntos sem qualquer pontuação.

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

Seu primeiro seletor procura elementos com o valor do atributo, contidos nos elementos da classe.
O espaço está sendo interpretado como o seletor descendente .

Seu segundo seletor, como você disse, procura por elementos com o valor do atributo ou a classe ou ambos.
A vírgula está sendo interpretada como o operador de seletor múltiplo - o que quer que isso signifique (os seletores de CSS não têm a noção de "operadores"; a vírgula é provavelmente mais precisamente conhecida como delimitador).

Eu acho que você só precisa remover o espaço. ie

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

Há um violino aqui http://jsfiddle.net/xXEHY/

Este código também funciona:

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

Isso também funcionará:

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