responsvie delete is not work in each row table

anish332

if i hav create table its delete is work but when i give mobile responsive only tablerow delete child row is not delete can help ita any one

$(document).ready(function() {
$('#example').DataTable( {
"ajax": "demo.json",
"columns": [
{ "data": "name" },
{
"data": null,
"bSortable": false,
"mRender": function(data, type, full) {
return '<button class="btnDelete">Delete</button>';
}
} ,
{ "data": "position" },
{ "data": "office" },
{ "data": "extn" },
{ "data": "start_date" },
{ "data": "salary" }

    ]
} );

// each row selete delete top of the table only one button

$(document).ready(function() {
var table = $('#example').DataTable();

$('#example tbody').on( 'click', 'tr', function () {
    if ( $(this).hasClass('selected') ) {
        $(this).removeClass('selected');
    }
    else {
        table.$('tr.selected').removeClass('selected');
        $(this).addClass('selected');
    }
} );

$('#button').click( function () {
    table.row('.selected').remove().draw( false );
} );

} );

//table inside each row delete function

$("#example").on('click','.btnDelete',function(){
$(this).closest('tr').remove();
alert("SucessFull Delete data from DataBase U Cant Retrive This Data Again ");

});