Add footer rows dynamically as per data array
Add footer rows dynamically as per data array

I have a map where i get a multiple key-value pair and I need to display these as a summary in the footer.
I did tried to append to tfoot but its not getting displayed in tfoot dynamically
"footerCallback": function (row, data, start, end, display) {
var api = this.api();
for (let [key, value] of newMap) {
//add tfoot rows here dynamically
$('#tableShiftSummaryFooter').append('<tr><td>test</td></tr>');
}
}
Answers
just to add there has to be multipel TR and not a single TH
Footer cells and rows in the DataTable cannot be added after initialisation. They need to be present when the table is initialised.
Allan