更改H3標簽的顏色onclick

Question

我想用onclick事件將我的h3標簽的顏色（總共3個）更改為紅色，然后在選擇另一個h3標簽后將其更改回原始顏色。

現在選擇的h3標簽變為紅色。

 $(document).ready(function() { $('p.order').on('click', function() { $('h3').css('color', 'red'); }); }); 

 <div id="accordion"> <h3 class="alert"><p class="order">Orders</p></h3> <h3 class="cut"><p class="restaurant"> Restaurant</p></h3> <h3 class="icon"><p class="Account"> Account</p></h3> </div> 

Answer 1

你可以這樣做：

$(document).ready(function() { 
    $('#accordion h3').on('click', function() {
        $('#accordion h3').css('color', 'black');
        $(this).css('color', 'red');
    });
});

DEMO

Answer 2

P標簽位於H3標簽內。 要更改父H3的css，您必須使用jquery父函數：

$('p').on('click', function() { 
    $(this).parent('h3').css('color', 'red');
}); 

這樣它適用於所有P和H3