Как получить элемент внутри события аккордеона в jQuery

Question

Я использую следующий скрипт для обнаружения события click, поэтому элемент аккордеона расширяется, и мне нужно получить div, имеющий класс .cellArrow.

Html

<div class="cellArrow"></div> 

JS

$("#accordionContainer").on("accordionbeforeactivate", function (event, ui) { 

     var cellArrow = $(this).find(".cellArrow"); 
}; 

Проблема заключается в том, что каждая секция аккордеона имеет этот класс, так вот у меня есть все .cellArrow классы.

Вопрос в том, как получить <div> именно внутри элемента акрилонирующего огня?

Спасибо!

P.S. Вот HTML у меня есть:

<div id="accordionContainer"> 
    <h3>Item 1 
     <div class="cellArrow"></div> 
    </h3> 

    <div>First content panel</div> 

    <h3>Item 2 
     <div class="cellArrow"></div> 
    </h3> 

    <div>Second content panel</div> 
</div> 

Answer 1

попробуйте этот код,

$(function() { 
 
    $("#accordionContainer").accordion(); 
 
    $("#accordionContainer").on("accordionbeforeactivate", function(event, ui) { 
 

 
    var cellArrow = $('> .cellArrow',ui.newHeader); 
 
    alert(cellArrow.html()); 
 
    }); 
 

 
})

<link href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css" type="text/css" rel="stylesheet"> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js" type="text/javascript"></script> 
 

 
<div id="accordionContainer"> 
 
    <h3>Item 1 
 
     <div class="cellArrow">1</div> 
 
    </h3> 
 

 
    <div>First content panel</div> 
 

 
    <h3>Item 2 
 
     <div class="cellArrow">2</div> 
 
    </h3> 
 

 
    <div>Second content panel</div> 
 
</div>

Answer 2

Ваш селектор должен быть:

var cellArrow = $(ui.newHeader).find('.cellArrow'); 

https://api.jqueryui.com/accordion/#events