Javascript div'上的触发事件；包含事件的内容

我有一个带有事件的div，单击它可以做一些事情，这个div包含项目列表，每个项目也有一个事件。 我试图做的是只触发单击项的事件，而不是同时触发该项及其容器的事件

行动1
行动2
行动3

$（'.container'）。单击（函数（）{
var x=document.getElementById（'result'）；
$（x）.append（'container clicked'）；
});
$（'container ul'）。在（'click'，'li'，函数（e）上{
e、 预防默认值（）；
var x=document.getElementById（'result'）；
$（x）.append（'li clicked'）；
});

您需要

e.stopPropagation（）

e.preventDefault（）可以消失，因为没有要抑制的默认操作

我希望你能做到这一点：

$('.container ul').on('click','li',function(e){
    e.stopPropagation();
    $("#result").append(this);//move the clicked LI element to the container #result
});

使用


$('.container ul').on('click','li',function(e){
    e.stopPropagation();
    var x = document.getElementById('result');
    $(x).append(' li clicked');
});

$('.container ul').on('click','li',function(e){
    e.stopPropagation();
    $("#result").append(this);//move the clicked LI element to the container #result
});

$('.container ul').on('click','li',function(e){
    e.stopPropagation();

    var x = document.getElementById('result');
    $(x).append(' li clicked');
});