添加行，但每行添加额外的html

Question

我在这里使用Datatable添加新行。

我希望当我附加每个自定义html时，新添加的html将保留在我的tr的底部。奇怪的是它刷新了所以只有第一次点击工作。我在下面创建了一个演示：

https://jsfiddle.net/gvowhrmp/

function appendRow(name, position, office, age, date,salary) {
    var t = $('#example').DataTable();

    var node = t.row.add([
      name,
      position,
      office,
      age,
      date,
      salary,
    ]).draw().node();

    var detail_row = '';

    detail_row = '<h3>Custom HTML</h3>';

    $(node).addClass('result-row');

    node = node.outerHTML += detail_row;

    $(node).hide().fadeIn('normal');
  }