Выбрать племянницу и изменить род занятий

Question

У меня есть этот код начальной загрузки (сведенной к минимуму).

<div id='DD_type' class="dropdown"> 
    <button class="btn" ></button> 
    <span id='af'>Type</span> 
    <ul class="dropdown-menu"> 
     <li> 
     I want this HTML(its more than text) in my button 
     </li> 
    </ul> 
</div> 

<div id='Another Dropdown' class="dropdown"> 
    <button class="btn" ></button> 
    <span id='af'>Type</span> 
    <ul class="dropdown-menu"> 
     <li> 
     I want this HTML(its more than text) in my button 
     </li> 
    </ul> 
</div> 

Я хочу заполнить кнопку первым элементом в ли. У меня теперь есть статическое решение.

$(function() { 
    $('#DD_LayOut>button').html($('#DD_LayOut>ul>li').html()) 
} 

Однако я хотел бы иметь общее решение. (Да, я немного искал).

Шахта не работает вообще.

$('.dropdown > button').html($(This).siblings('ul>li:first').html()) 

Не могли бы помочь мне с этой проблемой.

Заранее благодарен!

Answer 1

Для достижения этой цели вы можете предоставить html() метод с функцией как сфера действия этой функции будет являться button элементом, который вы можете использовать для обхода DOM, чтобы найти нужный li, что-то вроде этого:

$('.dropdown > button').html(function(i, h) { 
    return $(this).siblings('.dropdown-menu').find('li:first').html(); 
}); 

Working example