Не срабатывает клик по классу?

Question

[id56346gera]

$(".user-row-id").click(function(e) {
    e.preventDefault();
    var link = $(this);
    uid = link.attr("data-user-id");
    $.ajax({
        type: "GET",
        url: "getOtpInfo.php", 
        data: {"userId": uid},
        cache: false,                       
        success: function(response){
            var data = JSON.parse(response);
            console.log(data);
            $('.vacation-row').remove();
            for(var i=0;i<data.length;i++) {
                let tr = $('<tr class="vacation-row">'
                            +'<td align="center">'
                               +'<a href="' + data[i]['ID_Vacation'] + '" data-vacation_redaction-id="' + data[i]['ID_Vacation'] + '" id="polojit" class="btn btn-default data-vacation_redaction-id" data-toggle="modal" data-target="#redaction_vacation"><em class="fa fa-pencil"></em></a>'
                               +'<a data-vacation-id="' + data[i]['ID_Vacation'] + '" class="btn btn-danger data-vacation-id" data-toggle="modal" data-target="#dell_vacation"><em class="fa fa-trash"></em></a>'
                               
                            +'</td>'
                            +'<td>' + data[i]['Start_date'] + '</td>'
                            +'<td>' + data[i]['End_date'] + '</td>'
                            +'<td>' + data[i]['Day_numb'] + '</td>'
                            +'<td>' + data[i]['Unspoken_days'] + '</td>'
                            +'<td>' + data[i]['Main'] + '</td>'
                            +'<td>' + data[i]['Secondary'] + '</td>'
                            +'<td>' + data[i]['Number_decree'] + '</td>'
                            +'<td>' + data[i]['Date_decree'] + '</td>'
                        +'</tr>');
                tr.appendTo('#table-content');
            }  
            }
        });
});

Добрый вечер. Помогите не срабатывает клик по классу. Спасибо за помощь.

Суть в том, что я кликаю по классу user-row-id и аякс возвращает JSON который распарсили и в цикле выводим данные в таблицу достраивая <td>. Далее после того как таблица появилась у меня в ней также вывелись и кнопки, а точнее это ссылка в виде кнопки у этой ссылке есть класс data-vacation_redaction-id
И вот суть проблемы нажимая на эту кнопки по классу я делаю простую проверку алертом и он не выводит сообщение. Ошибку не показывают вообще ничего как будто он класс не видит В чём может быть проблема ? Как решить её ?

Вот клик по классу data-vacation_redaction-id

$(".data-vacation_redaction-id").click(function(e){
    e.preventDefault();

    alert("Проверка");
});

Answer 1

[Владимир Проскурин]

Клик привязывается к существующим элементам, а эти добавляются позже, поэтому к ним не привязывается обработчик. Нужно писать так

$("#table-content").on("click", ".data-vacation_redaction-id", function () {
    e.preventDefault();

    alert("Проверка");
});

т.е. тут мы привязываем клик на #table-content, но обрабатываем его только в том случае, если его event.target равен нужному нам блоку (т.е. если кликнули по .data-vacation_redaction-id).