Выделите два класса флажка с разным цветом

Question

У меня есть таблица, содержащая два столбца флажков, используемых для двух разных целей. Я хочу выделить их при нажатии с двумя разными цветами. Как изменить свой код, чтобы получить желаемый результат

<style> 
    a1.highlight { 
     background-color:grey; 
    } 

    a2.highlight { 
     background-color:red; 
    } 
</style> 

echo "<td align='center'><input type='checkbox' name='cb1[$no]' id='cb1{$no}' class='a1'></td>"; 
echo "<td align='center'><input type='checkbox' name='cb2[$no]' id='cb2{$no}' class='a2'></td>"; 

Answer 1

Кажется, у вас есть CSS в месте для цветов и единственное, что отсутствует событие, чтобы изменить цвет.

Для этого вы можете использовать некоторые довольно простой JQuery так:

$('.a1,.a2').click(function(){ 
    $(this).addClass('highlighted'); 
}); 

выше присоединит highlighted класс один раз либо a1 или a2 был щелкнули.