jquery 添加html元素后 html中click失效问题

jqeury 添加html 元素后 .click 失效问题

<script>
    function xxx() {
        var abc = '<li><h3 class="geegee">3</h3></li>';
        var acc = '<li><h3 class="geegee">4</h3></li>';
        output = $(abc + acc);
        $('#category').append(output);
    }
</script>

<script>
    $(document).ready(function() {
        $(".geegee").click(function() { //bug
            alert("a");
        });
    });
</script>

自 jQuery 版本 1.7 起，on() 方法是 bind()、live() 和 delegate() 方法的新的替代品。该方法给 API 带来很多便利，我们推荐使用该方法，它简化了 jQuery 代码库。使用 on() 方法添加的事件处理程序适用于当前及未来的元素（比如由脚本创建的新元素）

$(".geegee").on("click",function() {
    alert("a");
});

委派事件

$("#category").delegate(".geegee","click",function(evt) {
    alert("a");
    evt.stopPropagation();
});

ss