Click for dynamically generated elements

HTML

Select options
<select id='report' name='report'>
    <option value=''>Select</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select>
<div id='rest_load'></div>

CSS

div{margin:10px;}
span{margin-left:10px; cursor:pointer;}

JavaScript

$(document).ready(function(){
	$("#report").on('change',function(){
    	var num = $(this).val();
        if(num > 0){
        	var html = "";
            for(i=1; i<=num;i++)
            {
                html += "<div id='holder"+i+"'><input name='name[]' ><span class='dcriptionAdd' attr='holder"+i+"'>ADD</span><div class='description_holder'></div></div>";
            }
            
            $("#rest_load").html(html);
        }else{
        	alert("select value");
        }
        
    });    
});

$('#rest_load').on('click','.dcriptionAdd', function() {
  	attrVal = $(this).attr('attr');
    htm = "<p><textarea name='description[]'></textarea><span class='addd'>Add Detail</span><br/><span class='remove'>remove</span></p>";
	$("#"+attrVal).find('.description_holder').append(htm);
});

$("#rest_load").on("click",".remove",function(){
	$(this).parent().remove();
});

$("#rest_load").on("click",".addd",function(){
    ht="<p><input type='text' name='detail_name[]'><span class='rem_det'>Remove_Detail</span></p><br/>";
    $(this).parent().append(ht);
});
$("#rest_load").on("click",".rem_det",function(){
    $(this).parent().remove();
});