jquery button funktioniert gut zum ersten Mal, aber das zweite Mal funktioniert nicht

Question

Ich habe eine sehr einfache index.html-Datei erstellt und innerhalb ich einige Jquery-Skript enthalten. Sie können unten sehen:

<script> 
     $(document).ready(function(){ 
     var $tweets = $('.tweets'); 
     var current_position = -1; 
     function getTweets(){ 
      var index = streams.home.length - 1; 
      var cp = index; 
      while(index >= current_position + 1){ 
      var tweet = streams.home[index]; 
      $tweets.append('<div class="twe"><span class="name" style="color:blue">' + '@' + tweet.user + ': ' + ' </span><span class="message">' + tweet.message + tweet.created_at + '</span></div>'); 
      index--; 
      } 
      current_position = cp; 
     } 
     getTweets(); 
     $('button').click(function(){ 
      getTweets(); 
     }); 
     $('.name').click(function(){ 
      $tweets.prepend('<div>' + 'objname' + streams.home.length + '</div>');   
     }); 

     }); 
</script> 

es eine Taste für Updates alle Tweets verwendet wird und sie dynamisch mit Klasse im Abschnitt setzen = „Tweets“ Teil. Und dieser Knopf funktioniert gut, egal wie oft ich ihn drücke.

Dann füge ich mit Klassennamen ‚name‘ Ereignis für alle diejenigen, klicken und wenn ich darauf klicken, wird es fügen ‚objname‘ + streams.home.length auf der Vorderseite meines Abschnitt class = „Tweets“ Teil. Das Problem ist das erste Mal, ich klicke auf $ ('. Name') es funktioniert gut, aber später, nachdem ich mehr Elemente durch $ ('Button') Click Event hinzugefügt. Es scheint, dass die neu erstellten $ ('. name') Elemente nicht anklickbar sind, was bedeutet, dass sie 'objname' + streams.home.length nicht an den Anfang meiner Sektion mit class = "tweets" Teil generieren. Ich bin hier wirklich verwirrt und weiß nicht warum.

Answer 1

try folgenden

$("body").on("click",".name",function(){ 
      $tweets.prepend('<div>' + 'objname' + streams.home.length + '</div>');   
     }); 

Als Ihr Element Laufzeit auf der Seite hinzugefügt wird, benötigt es mit Hilfe von „on“, die Ereignisse gesorgt getrennt werden automatisch binden, wenn ein Ereignis erstellt wird.

check reference