JQuery .click () не работает с шаблоном

html-код:

 <div id="cntr"></div>

Код js:

$(document).ready(function(){
$.ajax({
   type: "GET",
   url: "/Home/GetComment",
   dataType: "JSON",
   success: function (comments) {
       var template = '';
       for (var i = 0; i < comments.length; i++) {

            template += '<a id="like_button" class="like-comment" href="#">Like     <span class="glyphicon glyphicon-thumbs-up"></span></a>'
        }

       $('#cntr').html(template);
       addEvent();
   }
  });

 function addEvent() {
    $("#like_button").on('click', function (evt) {
      $.ajax({
          type: "POST",
          url: "/Home/AddLikes",
          data: { "likeid": id },
          dataType: "JSON",
          success: function (d) {
              alert('Here');
          }
      });
   });
  }
});

Попробуй это

$("body").on("click", "#like_button", function (evt) {
    $.ajax({
        type: "POST",
        url: "/Home/AddLikes",
        data: { "likeid": id },
        dataType: "JSON",
        success:
            function () {
                alert('alert');
            }
    });
});

Когда функция jQuery, определяющая щелчок на методе, выполняется, кнопка еще не создана! Вы должны добавить метод click к элементу, который уже существует (тело всегда есть).

Таким образом, функция ниже читается так: Когда вы нажимаете на тело, найдите like_button (если он есть) и щелкните по нему (делегируйте ему событие) :).

$("body").on("click", "#like_button", function (evt) {
    $.ajax({
        type: "POST",
        url: "/Home/AddLikes",
        data: { "likeid": id },
        dataType: "JSON",
        success:
            function () {
                alert('alert');
            }
    });
});

Я думаю, в настоящее время вы дублировали id, вы должны использовать класс вместо своей кнопки:

var template = '<a class="like_button" class="like-comment" href="#">Like <span class="glyphicon glyphicon-thumbs-up"></span></a>'

Затем вы можете использовать делегирование событий для присоединения событий для динамически загружаемых элементов:

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

$('body').on('click','.like_button',function() {
    // Your code here
});