我有这个代码在JSFiddle中工作，但不在我的网站上

Question

I want to create a new button every time the post button is clicked and each new button should have its own counter. This works in JSFiddle but not when I use it.

  $(function() { $('.input_button').on('click', function() { text = $('.input_text').val(); var btn = $("<button></button>"); btn.text("Like!"); $("body").append(btn); btn.after("<span class='clicks'></span>") var clicks = 0; btn.click(function() { clicks++; $(this).next(".clicks").html(clicks); }); if (text != undefined) { post = '<div class="post test--post">' + '<img src="photo.JPG" width="20" height="25" alt=""/>' + '<p><span>jaleelg: </span></p>' + text + '<p>Clicks: <a id="clicks">0</a></p>' + "<br>" + Date() + " " + '</div>'; new_post = $('.post_feed').append($(post)) new_post = $('.post_feed').append($(btn)) } }); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <section> <h3 id="feed">My Posts</h3> <section class="post_feed test--post_feed"> </section> </section> <input class="input_text test--input_text" type="text"> <button type="submit" class="input_button test--input_button">Post</button> <div id="clicks"> </div> 

Answer 1

You have to change in this:

btn.click(function() {
       clicks++;
       $(this).next(".clicks").html(clicks);
     });

Like this:

btn.click(function() {
$('.clicks').html(function(i, val) { return val*1+1 });       
     });   

Answer 2

This pen works: http://codepen.io/anon/pen/ygRxOq?editors=0010

$(function() {

  $("body").on("click",".like",function(e) {
    clicks = $(e.target.parentElement).find("#clicks").text() / 1 + 1;
    $(e.target.parentElement).find("#clicks").text(clicks);
  });

  $('.input_button').on('click', function() {
    text = $('.input_text').val();
    post = '<div class="post test--post">' + 
               '<img src="photo.JPG" width="20" height="25" alt=""/>' + 
               '<p><span>jaleelg: </span></p>' + text + 
               '<p>Clicks: <a id="clicks">0</a></p>' + 
               '<br>' + Date() + '<br>'+
               '<button class="like">Like!</button>'+
           '</div>';

    new_post = $('.post_feed').append($(post));
  });

});