Получить элемент внутри конкретного элемента

Question

У меня есть PHP код, построить HTML код так:

echo '<button><span class="glyphicon glyphicon-zoom-in afficher_itk" aria-hidden="true"></span></button>'; 

echo' <div class="itk" id="'.str_replace(' ','',$systeme_culture['nom_plante']).'"> 
    <table class="table"> 
     <th><td> 
      <tr colspan="2"> 
        <label>Nom : </label> 
        <input class="nom_itk" id="nom_itk" value="test"> 
      </td</tr> 
     </th> 
    </table> 
</div>'; 

Этот код генерируется динамически, и я могу иметь более 1 подобный код.

Поскольку у меня может быть несколько таких вещей, я хочу настроить таргетинг на элемент прав при запуске javascript.

Когда я нажимаю на кнопку, я хочу добавить содержимое внутри соответствующего input. Не первый, не последний, а только соответствующий код.

У меня есть что-то подобное в ЯШ:

Но этот код не работает. Может кто-то знает, как я могу это сделать, пожалуйста?

Answer 1

Не выбирайте ближайший itk, ближайший проход вверх в DOM Tree. Вместо того, чтобы использовать .next для выбора следующего itk из текущего элемента:

$(".afficher_itk").click(function(){ 
    $itk = $(this).next(".itk"); 
    $itk.find(".nom_itk").val("test"); 
}); 

Answer 2

Я нашел, как я могу быть. Вместо того, чтобы выбрать closest, я получаю родителя td с функцией parents(). После этого я могу использовать функцию find.

$itk = $(this).parents('td'); 
$itk.find('.nom_itk').val("lison"); 

Answer 3

Попробуйте:

Это работает, если элемент DOM Object

jQuery("html").on("click",".afficher_itk", function(){ 
    $itk = $(this).next(".itk"); 
    $itk.find(".nom_itk").val("test"); 
});