jQueryUI Аккордеонный Заголовок Проблема с CSS

Question

У меня есть заголовок гармошки, вот так,

<div id="accordion">
    <h3 id="header1"><a href="#">Stuff: <span id="text">Text </span></a></h3>

и при наступлении какого-либо события я меняю цвет <span id="text">.

$("h3 #text).css("color","red");

Что я хочу сделать, это изменить цвет обратно на цвета заголовка аккордеона по умолчанию. Я могу изменить его обратно на цвет по умолчанию, но тогда он не изменит цвет, когда вы наводите курсор на него или щелкаете по нему.

Есть ли способ изменить его класс или что-то?

Answer 1

Да, toggleClass . Вы хотите что-то вроде:

$("h3 #text).mouseEnter(function{$("h3 #text).toggleClass("header1Active");});
$("h3 #text).mouseLeave(function{$("h3 #text).toggleClass("header1Active");});

Где у вас есть немного CSS:

h3.header1Active {
    color: red
}