popover was broken when useing datatable of severside data mode

[kit-lee]

I have a datatable like this `$(document).ready(function(){ $('#tb-unified-records').DataTable({ columns: [ { "data": null }, { "data": "receiveDate" }, { "data": "model" } ], columnDefs: [ { className: 'select-checkbox', targets:0, render: function ( data, type, full, meta ) { return ''; } },{ targets:2, render: function ( data, type, full, meta ) { return "<i data-trigger=\"hover\" data-toggle=\"popover\" data-placement=\"auto bottom\" data-content=\""+data.txt+"\">"+data.code+"</ i>"; } return ''; } }], select: { style: 'multi', selector: 'td:first-child' }, "ordering": false, bFilter: true, processing: true, serverSide: true, ajax: { "url": "/unifiedRecords.do?method=manageList", "type": "POST" }, pagingType: "simple_numbers", "paging": true, "searching": false, dom: "<'row'<'col-sm-12'tr>>" + "<'pmd-card-footer' <'pmd-datatable-pagination' l i p>>", });

    //init popover when datatable complate a draw
    $('#tb-unified-records').on( 'draw.dt', function () {
        $('[data-toggle="popover"]').each(function(i,e){
            popover(e);
        })
    } );

   //init the popover
   function popover(o){
    var e = $(o);
    var tg = e.attr('data-trigger');
    var t = e.attr('data-title');
    if(t==undefined || t==null)
        t = '';
    var h = e.attr('data-html');
    if(h==undefined || h==null)
        h = false;
    var p = e.attr('data-placement');
    var c = e.attr('data-content');
    $(o).popover({
        trigger:tg, 
        title:t,
        html: h, 
        placement:p,
        content:c
    });
}
});`

the popover correctly triggered, but only the ‘arrow’ part, the box of title and content was disappeared