En sak jag reagerar på är att du i din $(".insert")-klicklyssnare skickar in en sträng till din bindBehaviors-method som dock förväntar sig en selektor eller eventuellt ett jquery-objekt. Eftersom du skickar in en sträng till metoden kan den inte regga eventlyssnaren som den ska. Jquery har ibland beteendet att - på gott och ont - faila tyst när man gör saker som inte funkar. Man får inte reda på att man gör nånting tokigt utan saker och ting funkar helt enkelt bara inte.
Även om man rättar misstaget ovan och istället skickar in rätt scope (dvs bindBehaviors(".comment_wrapper")) finns det en liten tankevurpa där. De tidigare registrerade eventlyssnarna finns kvar men när bindBehaviors körs igen reggas det en till för varje ny rad som infogas. Dvs lägger man till en kommentar och sedan klickar på den första kommentarslänken kommer det resultera i 2 rader i konsollen.
En annan sak som är värd att nämna i när man pysslar med javascript är att man inte behöver regga en lyssnare på varje element. Det är t.o.m. ganska dumt om man kan tänkas ha många element som man ska kunna klicka på. Då är det bättre att använda sig av s.k. delegates som innebär att man reggar en (1) eventlyssnare
oavsett hur många kommentarer man har. Det funkar som så att man lägger eventlyssnaren på föräldernoden och säger åt den att köra en method när event triggas på en child-selektor.
I ditt fall skulle javascriptet kunna skrivas om till nåt i stil med:
Kod:
$(document).ready(function() {
$('.insert').on('click', function(e) {
e.preventDefault();
console.log('insert');
var tempDiv = '<div class="comment_wrapper"><a href="#" class="comment">Write your comment</a></div>';
$(this).before(tempDiv);
});
$("body").delegate(".comment", "click", function (event) {
event.preventDefault();
console.log('comment');
});
});
Eftersom det är en delegate som används behöver du inte regga eventlyssnare på nya element som du försökte göra tidigare.
Istället för att lägga lyssnaren på body kan du såklart wrappa dina kommentarer runt t.ex. <div id="#comments"> och skicka in id:t i delegaten istället för body.