Dynamically add footer to jQuery Datatable

footer.js

var oTable = $('#grid-table').DataTable({
  fnFooterCallback: function(row, data, start, end, display) {
    var api = this.api();
    var footer = $(this).append('<tfoot><tr></tr></tfoot>');
    this.api().columns().every(function () {
      var column = this;
      $(footer).append('<th><input type="text" style="width:100%;"></th>');
    });
  }
});