在append后新增的元素使用on绑定的click事件在手机端无法使用

Question

1. 描述你的问题
   在append后新增的元素使用on绑定的click事件在手机端无法使用

2. 贴上相关代码

   $(".iconfont").click(function(){
           $(".return-back,.head-search,.section-tit,.clear").css("display","none");
           $(".headwrap").append("<p class='header-cancel'>取消</p><div class='input-div'><input/><i></i></div>")
       });
   $("body").on("click",".header-cancel,.input-div i",function(){
       $(".header-cancel,.input-div").remove();
       $(".return-back,.head-search,.section-tit,.clear").css("display","block");
   })
   

点击生成的"取消"时无响应

Answer 1

把on换成delegate

$("body").delegate(".header-cancel,.input-div i","click",function(){...}