Запретить jQuery аккордеон от добавления ui-state-active

Question

Я использую аккордеон jQuery и хочу, чтобы выбранная панель выглядела иначе, чем пользовательский интерфейс jQuery. Чтобы понять это, я не хочу иметь класс «ui-state-active» в активном заголовке, и я не знаю, как это реализовать.

Моя текущая попытка:

$('#MyAccordion').accordion({ 
    heightStyle: "content", 
    collapsible: true, 
    active: 0, 
    activate: function() { 
     $('#MyAccordion h3').removeClass("ui-state-active"); 
    }, 
    create: function() { 
     $('#MyAccordion h3').removeClass("ui-state-active"); 
    }, 
    beforeActivate: function() { 
     $('#MyAccordion h3').removeClass("ui-state-active"); 
    } 
}); 

JS Fiddle Демо здесь: https://jsfiddle.net/SchweizerSchoggi/u2c6zcy6/1/

Вы можете видеть, заголовок выбранной панели становится белым на мгновение прямо перед класс быть снова удален. Но как я могу предотвратить заголовок панели, чтобы получить белый (получение класса ui-state-active) вообще?

Answer 1

Вы можете также добавить кнопку слушателя событий:

$('#MyAccordion').on('click', '.ui-accordion-header', function(e){ 
     $(this).removeClass("ui-state-active"); 
});