Выберите элемент, который только что был создан

Question

У меня возникла проблема при работе с JSON и последующем создании структурированного контента.

Дело в том, что единственный HTML из панели заключается в следующем:

<div class="users"> 
      <center>loading</center> 
      <script>update_users();</script> 
     </div> 

Но после загрузки информации с JSON это заканчивается тем, что-то вроде этого:

<div class="users"> 
<p class="name">User1</p> 
<div class="detailed"> 
    <span>Entry1: value1</span> 
</div> 
</div> 

Дело в том, что , в моем случае, например, я хочу, чтобы деталь был toggle();, так как значение display:none должно быть значением по умолчанию, но JQuery не хочет выбирать это новое содержимое.

//does work 
    $(".users").click(function(){ 
      $(".users .detailed").toggle(); 
     }); 

//doesn't work 
    $(".users .name").click(function(){ 
      $(".users .detailed").toggle(); 
     }); 

Как решить проблему, из-за которой Jquery не работает, чтобы выбрать новый контент, вставленный на страницу?

Answer 1

Для этого нового контента вам необходимо делегирование событий

$(document).on('click',".users .name",function(){ 
    $(".users .detailed").toggle(); 
}); 

Answer 2

Существует .live() метод, читать что-то об этом. я могу посоветовать вам использовать:

$.find(".users .name").click(function(){ 
      $(".users .detailed").toggle(); 
     }); 

Или вы можете связать некоторые функции с помощью .on("click", yourfunction);

Answer 3

использование on

$(document).on('click',".users .name",function(){ 
    $(".users .detailed").toggle(); 
}); 

Answer 4

Поскольку вы динамически создавать пункт .name простой .click() не будет работать Это. Вы должны использовать .on() методу

$(document.body).on('click', '.name' ,function(){ 
    $(".detailed").toggle(); 
}); 

И технически, если у вас есть более чем 1 пользователей, чем выше подход не будет работать, как он будет переключать все элементы, имеющие .detailed класс, вы должны попробовать это

$(document.body).on('click', '.name' ,function(){ 
    $(this).next().toggle(); 
}); 

EXAMPLE

Answer 5

$(".users .name").unbind(); 

отвязать затем перепривязывают