Получение идентификатора Div на заголовке Click, Accordion

Question

Я использую аккордеон Jquery для заселения динатри. Мне нужно, чтобы мои div-элементы аккордеона заполнялись по щелчку заголовка, поэтому я пытаюсь получить идентификатор id. Этот Jquery работает, но только когда я щелкаю внутри расширенного div, а не заголовка. Что имеет смысл, потому что мое событие.common click.

 $(".common").click(function () {
        var currentID = $(this).attr("id");
        alert(currentID);
    });    

 <div id="accordion">         
    <h3>Project Type</h3>
     <div id="1" class="common" style="height:150px;"> 
    </div>

    <h3>Ammenities</h3>
    <div id="2" class="common" style="height:150px;">  
    </div>
 </div>

Мне нужно выяснить, как я могу получить идентификатор Div по щелчку заголовка. Аккордеон играет не очень хорошо, поэтому, если я переключу свой идентификатор и класс на заголовок, событие не сработает. Я пытался использовать $("#accordion .common").click и это тоже не работает

Answer 1

Вы можете выбрать h3 элементы, которые являются предыдущим родным братом .common элемент

$(".common").prev('h3').click(function () {
    var currentID = $(this).next().attr("id");
    alert(currentID);
}); 

Демо: скрипка

или вы можете нацелиться на h3 элементы, которые являются детьми #accordion элемент

$("#accordion > h3").click(function () {
    var currentID = $(this).next().attr("id");
    alert(currentID);
}); 

Демо: скрипка