Twitter BootStrap Confirmation not working for dynamically generated elements

Try changing your event binding slightly so it's bound for every existing and future .delete-record element using the alternate $.on syntax.

$(document).ready(function(){    $('body').on('confirmed.bs.confirmation', '.delete-record', function() {        deleteForm($(this).attr('data-delid'));    });});

Not knowing your page structure I opted to bind to body, but you can bind it to any parent element of your table.

I think it because the elements dynamically generated by dom manipulation after document ready

How about use .delegate instead of .ready ?

$(document).delegate('.delete-record', 'confirmed.bs.confirmation', function() {    deleteForm($(this).attr('data-delid'));});

a more simple solution:you have an initialization like

$('[data-toggle="confirmation"][data-target="service"]').confirmation({});

put this inside a function before $(document).ready(function(){});and call it after the dynamic content is loaded

function confirm(){    $('[data-toggle="confirmation"][data-target="service"]').confirmation({        your options come here    });}$(document).ready(function(){    confirm();});