jQuery не распознает нажатия кнопок из $ (". class"). click () или $ (". class"). on (), но работает с $ (". class"). live ()

Question

Используя устаревший метод .live(), я могу сделать эту работу именно так, как мне хотелось бы, однако не идеально, чтобы это продолжалось. Я нашел похожие вопросы, предлагающие использовать метод $(".update").on() или вызвать $(document).on('click', $('.update'), function()...), однако я не смог заставить ни одно из решений работать. Лучшее, что я смог сделать, это вернуть полную таблицу, но так и не смог получить свой snap.key. Будем очень благодарны за любые предложения сделать эту работу с любым, кроме .live().

  <table id="itemTable">
    <thead>
    <tr>
      <th>Item</th>
      <th>Cost</th>
      <th>Quantity</th>
      <th></th>
    </tr></thead>
    <tbody id = "tableBody">
    </tbody>
  </table>

Firebase Call:

db.on('child_added', snap => {
    $('#tableBody').append('<tr><td class="up"><span>' + snap.key + '</span></td><td><button type = "button" class="update">Update</button></td></tr>');
});

обработчик кнопки:

$(".update").live('click',function() {
  var $row = $(this).closest("tr");   // Find the row
  var $text = $row.find(".up").text(); // Find the text
  console.log($text);
});

Answer 1

Вы хотите:

$(document).on('click', '.update', function(){...});

Обратите внимание, что второй аргумент on является селектором, в то время как вы передаете $('.update').