Dynamically add dom, and the corresponding delete event

 

 

 

 

 

 

<div class="TextCon"></div>

//global

var  zhj_global_params = {

　　geneNum : 0

　　getGeneNumFn :function(){

　　　　return this.geneNum ++;

　　}

}

var  textDom = '<div class="content"  id = "zhaDyDiv_zj@zhjGeneNum@">\n'+

　　'<p>Content</p>\n'+

　　'<a href="#"  data="zj@zhjGeneNum@">shanchu</a>\n'+

'</div>'

//click the add button

$('#addBtn').on('click',function(){

　　var reg = / zj @ zhjGeneNum @ / g;

　　var  textDomAppend = textDom,replace(reg,zhj_global_params.getGeneNumFn())

　　$('.TextCon').append(textDomAppend);

})

$('.TextCon').on('click','a',function(){ //Bind event

　　$('#zhjDyDiv_' + $(this).attr('data')).remove();

})