遍历得到了树结构，怎么给树结构添加点击事件呢？

Question

下面是一个简单的树状结构，就要做成侧边栏展开，怎么给每一个父节点和子节点添加点击事件呢？

var data2 = [
  {"id":1,children:[{"id":"child11"},{"id":"child12"}]},
  {"id":2},
  {"id":3children:[{"id":"child31"},{"id":"child32"}]},
  {"id":4},
];

var str="<ul>";

data2.forEach(function(v,i){
  if(v.children&&v.children.length>0){
    str+="<li><span>"+v.id+"</span>";
    str+="<ul>";
    v.children.forEach(function(value,index){
      str+="<li><span>"+value.id+"</span>";
    })
    str="</ul>";
    str="</li>";

  }else{
    str+="<li><span>"+v.id+"</span></li>"
  }
})
str="</ul>"

$(doucment).append(str);

Answer 1

事件委托。
$('body').on('click', 'li', function(){})