JavaScript無法在JQuery Accordion中單擊時更改文本

Question

在這樣的頁面上遇到問題： https ： //staging.hellodadventures.com/event/clippers-scifest-socal/

我有一個更多信息按鈕的位置，當點擊“+更多信息”文本應該改變，但它不是。 我是基於我發現的這個小提琴 ，但如果你看看我的例子，沒有任何改變。

這是我在PHP中的內容：

<div id="accordion">
    <p>+ More Info</p>
        <div><p>Text goes here</p></div>
</div>

然后是我的JS：

//change button text on click
jQuery('.ui-accordion-header').click(function(){
    var $this = jQuery(this);
    $this.toggleClass('ui-accordion-header');
    if($this.hasClass('ui-accordion-header')){
        $this.text('+ More Info');
    } else {
        $this.text('- Less Info');
    }
});

我將$從示例更改為jQuery，因為它是一個WordPress站點。

任何想法為什么這不會改變點擊？ 我也嘗試使用按鈕元素，但沒有變化。

Answer 1

jQuery（'。ui-accordion-header'）試圖用類“ui-accordion-header”抓取一個元素

<p class="ui-accordion-header">+ More Info</p>應該有效。