javascript - Click event in dynamically created Element -


i new javascript , learning new things day day. here need click button , new button created need again click newly created button , create new button again , on. must in pure javascript.please me out

 document.getelementbyid("btn").addeventlistener("click",function(e) {         var btn=document.createelement("button");         var t=document.createtextnode("click me");         //some code click dynamically created element         btn.appendchild(t);         document.body.appendchild(btn); 

make generic function , bind click events method.

function addbutton () {      var btn = document.createelement("button");      btn.type = "button";      var t = document.createtextnode("click me");      btn.appendchild(t);       btn.addeventlistener("click", addbutton);      document.body.appendchild(btn);  }    document.getelementbyid("btn").addeventlistener("click", addbutton);
<button type="button" id="btn">button</button>

or event delegation

function addbutton () {      var btn = document.createelement("button");      btn.type = "button";      var t = document.createtextnode("click me");      btn.appendchild(t);       document.body.appendchild(btn);  }    document.body.addeventlistener("click", function(e) {      if (e.target.tagname==="button") {  //i use class or data attribute instead of tagname        addbutton();      }  });
<button type="button" id="btn">button</button>


Comments