用jquery更改DOM元素CSS

Question

我有两个可点击的标题。 当您单击一个时，它变为蓝色。 如果单击另一个，它会变为蓝色，但应“取消单击”另一个标题并将其改回黑色。

我正在尝试使用jQuery not ...

$("#pal1, #pal2").click(function(event) {
    $(this).css({"color" : "blue"});
    var pal1 = $(this).attr('id');
    var pal2 = $(this).next().attr('id');   
    $(this).not(pal2).css({"color" : "black"}); //if the selected heading is not pal1, or not pal2, changed the one that is not == $(this) back to black.
});

或类似的东西。

---

编辑：我知道我可以这样做...但是想使用jQuery函数来减少代码大小。 再加上这不是很有效。

$("#pal1, #pal2").click(function(event) {
    $(this).css({"color" : "blue"});        
    if ($(this).attr('id') !== $("#pal1").attr('id')) {
        $("#pal1").css({"color" : "black"});
    }
    else {
        $("#pal2").css({"color" : "black"});
    }
});

Answer 1

将两者都设置为black ，然后将单击的对象设置为blue 。

$("#pal1, #pal2").click(function(event) {
  $("#pal1, #pal2").css({"color" : "black"});
  $(this).css({"color" : "blue"});
});