Когда я добавляю в таблицу HTML, используя jquery, я не могу вызвать событие щелчка строки таблицы

Question

Я использую asp. net mvc. Я пытаюсь добавить в таблицу HTML, используя jquery. Я получаю строки из вызова get JSON и добавляю их в таблицу. Строки добавляются, но по какой-то причине добавленные строки не вызывают событие click. Я думаю, может быть, это связано с синхронизацией или что-то, но я не уверен.

контроллер

using System;
using System.Web;
using System.Web.Mvc;

namespace Test
{
    public class HomeController : Controller
    {
        public ActionResult Index()
        {
            return View();
        }

        public ActionResult Test(string x)
        {
            string strJson = "[{\"name\":\"tom\",\"number\":\"111\"},{\"name\":\"bill\",\"number\":\"222\"}]";
            return Json(strJson, JsonRequestBehavior.AllowGet);
        }

    }
}

view

@{
    Layout = null;
}

<style>
    td {
        border: 2px solid black;
    }
</style>

<br />
<br />

<table id="table1">
    <tr>
        <td>
            name
        </td>
        <td>
            number
        </td>
    </tr>
</table>

<br />
<br />

<button id="button1" type="button">append rows</button>

<script src="~/Scripts/jquery-3.4.1.js"></script>

<script>

    //table click event
    $(document).ready(function () {

        $("#table1 tr").click(function () {

            alert("table row clicked");

        });

    });

    //button click event
    $(document).ready(function () {

        $("#button1").click(function () {

            $.getJSON('@Url.Action("Test")', { x: "1" }, function (y) {

                y = $.parseJSON(y);

                $.each(y, function (i, item) {

                    $('#table1').append('<tr><td>' + item.name + '</td><td>' + item.number + '</td></tr>');

                });

            });

        });

    });

</script>

Answer 1

Событие не инициируется, поскольку строка добавляется после присоединения обработчика события. Использование:

$(document).on("click", "#table1 tr", function (){}