La fila de resaltado no está desapareciendo después de hacer clic en la siguiente fila de la tabla

Necesito crear un fondo en amarillo mientras selecciono el ícono de engranaje para la opción de menú en la fila de la tabla. He probado el siguiente código para resaltar la fila de la tabla.

var view = Core.view.Menu.create({ model: model, menuContext: { ibmm: ibmm }, anchor: this.$(), highlight: this.$().parents('tr:first').css('background-color','yellow') }); view.show(); 

Al seleccionar el menú de la fila de la tabla (oculto) con el icono de engranaje, el color de fondo está saliendo bien.

introduzca la descripción de la imagen aquí

archivo html correspondiente está debajo

  

Pero cuando me muevo a la siguiente fila de la tabla (no oculta), el color de la fila de la tabla anterior sigue siendo de color amarillo, no desapareciendo.

introduzca la descripción de la imagen aquí

Estoy usando el siguiente código css para crear el resaltado cuando hago clic en la fila

 table.content-table.highlighted tr.content-row:focus { background: #FFFF99 none 0 0 repeat; } 

¿Alguien puede sugerirme código para esto? Estoy usando Ember 1.4.0.

puede probar debajo de jquery para restablecer el color de fondo donde ocurrirá el evento en el enfoque.

 $(function(){ $("table.content-table.highlighted tr.content-row").on("focusout", function(){ $(this).css('background','#FFFF00 none 0 0 repeat'); // change color code as per your need }); }); 

Verifica la diferencia entre :first y :first-child

 var view = Core.view.Menu.create({ model: model, menuContext: { ibmm: ibmm }, anchor: this.$(), highlight: this.$().parents('tr:first-child').css('background-color','yellow') }); view.show();