Không bắt được event onclick sau khi reload datatables

Đây là đoạn code jQuery để bắt event onclick của mình:

$('input#delete').on('click', function() {
	var r = confirm("Do you really want to delete this row?");
	
	if (r == true) {
		// Get index of this row
		var detailsId = $(this).data('id');
		console.log(detailsId);
		
		// Call ajax function
		$.ajax({
    		dataType: "json",
			type: 'POST',
			data: {},
			contentType: "application/json",
			url: "/SERP/stockRequisition/deleteDetails/" + detailsId,
			success: function(data){
				console.log(data.deleteStatus);
				if(data.deleteStatus == true){
					// Remove row from DataTable by index (detailsId - 1)
					var table = $('#detailsTable').dataTable();
					table.fnDestroy();
					$('#detailsTable tbody').empty();
					reloadTable();
					// var table = $('#detailsTable').DataTable();
					// table.row(detailsId-1).remove().draw(false);
				} else if (!data.deleteStatus) {
					alert("Delete failed! Please try again later.");
				}
			},
			error: function(){
				alert('Cannot delete this details!!');
			}
    	});
	}
});`

Hàm reloadTable để load lại toàn bộ bảng datatables sau khi delete 1 dòng:

function reloadTable(){
console.log("Reload table");

$.ajax({
	dataType: "json",
	type: 'GET',
	data: {},
	url: "/SERP/stockRequisition/srdJsonList",
	contentType: "application/json",
	success: function(data){
		if(data.srdes.length == 0){
			alert("No data in table.");
		} else {
			var rowCount = 1;
			
			$.each(data.srdes, function(key, value){
				$('<tr>').append(
						$('<td>').text(rowCount++),
						$('<td>').text(value.elementName),
						$('<td>').text(value.phi),
						$('<td>').text(value.length),
						$('<td>').text(value.width),
						$('<td>').text(value.height),
						$('<td>').text(value.materialName),
						$('<td>').text(value.quantity),
						$('<td>').text(value.elementUnit),
						$('<td>').text(value.note),
						$('<td>').html('<div class="dropdown">' + 
				        		   '<button class="btn btn-primary dropdown-toggle" type="button"' +
				        		   ' data-toggle="dropdown">' + data.actionBtn +
				        		   '<span class="caret"></span></button><ul class="dropdown-menu">' +
				        		   '<li><button type="button" class="btn btn-info" data-toggle="modal" ' +
				        		   'data-target="#updateStockRequisitionDetails" id="update" ' + 
				        		   'data-id="' + (rowCount+1) + '" formnovalidate>' + data.updateBtn + 
				        		   '</button></li><li><input type="button" class="btn btn-warning" ' +
				        		   'id="delete" data-id="' + (rowCount+1) + '" ' + 
				        		   'formnovalidate value="' + data.deleteBtn + '" /></li></ul></div>')
				        		   ).appendTo('#detailsTable');
				console.log(data);
			});
		}
	},
	error: function(){
		alert("Cannot get data from database!");
	}
});
};`

Lần đầu khi bấm Xóa thì rất bình thường, không bị lỗi gì cả, nhưng sau khi load lại bảng thì event onclick không còn hoạt động được nữa. Mình check trên console thì thấy rõ ràng không nhảy vào được hàm onclick, mặc dù sau khi reload lại thì id mình vẫn cung cấp đầy đủ. Mong mọi người giúp đỡ. Thanks.