Eu tenho uma mesa com ong-class diretiva como esta:

<tbody>
      <tr style="cursor: pointer" class="clickable-row" ng-repeat="firm in device.firmwares" ng-class="{'success': firm.vulnScore<= 4,'warning' :5<= firm.vulnScore,'danger' : 8<=firm.vulnScore}">
          <td>{{firm.fileName}}</td>
          <td>{{firm.extracted}}</td>
          <td>{{firm.vulnScore}}</td>
          <td>{{firm.date}}</td>
      </tr>
</tbody>

Basicamente, o que faz é colorir as linhas, dependendo do valor do vulnScore; isso funciona muito bem !, mas eu preciso poder selecionar as linhas, concluí isso fazendo:

$('#firm_table').on('click', '.clickable-row', function(event) {
    $(this).addClass('bg-primary').siblings().removeClass('bg-primary');
});

e funciona ... mas a única coisa que ele faz é mudar o texto em branco, porque já existe uma classe de cores atuando nele ... preciso poder remover a classe de atuação (sucesso, aviso ou perigo) quando é selecionado e o coloca de volta quando outro é selecionado, seria fácil se houvesse apenas uma turma ... mas não sei como saber qual deles tive em primeiro lugar e como colocá-lo de volta!

Isto é o que eu tenho: (a primeira linha é selecionada):

O que eu realizei

e o que eu o que realizar é algo como:

O que eu realmente quero

se alguém puder ajudar eu realmente aprecio isso!