JQuery--新增动态元素点击事件失效

问题：在一个点击事件里，动态添加的元素，注册的点击事件无效。

看下面的代码：

    $(function () {
        $(".test").click(function () {
            $("<div>动态添加元素点击失效</div>").addClass("test2").appendTo($(this));
        })
        $(".test2").click(function () {
            console.log("hi,点击事件2");
        });
    });

在一个点击事件里，动态地添加新的元素，然后在点击事件外注册该新元素的事件，就是发生事件没有注册上的bug。

解决办法：

1. 动态创建的同时，添加点击事件

        $(".test").click(function () {
            $("<div>动态添加元素点击失效</div>")
                .addClass("test2")
                .click(function () {
                    console.log("hi,点击事件1");
                })
                .appendTo($(this));
        })

2. 采用on("click",[className],function)的方式

        $(".test").click(function () {
            $("<div>动态添加元素点击失效</div>")
                .addClass("test2")
                .appendTo($(this));
        })
        $(".test").on("click", ".test2", function () {
            console.log("hi,点击事件2");

        });