Framework 7- How to clear previous append data when change page

Question

i have a problem when change page, data append can't remove

for example : i append with javascript in init page

        $$(document).on('click', '#btnappend', function (e) {
             var table = '<table id="barang_detail" class="tabel-detail" cellspacing="0">'+
            '<tr><td style="width:8px;">Barang</td><td id="det_nama">'+$$(this).attr('data-nama_barang')+'</td></tr>'+
            '<tr><td>Harga</td><td id="det_harga">'+$$(this).attr('data-harga')+'</td></tr>';

            $$('#div_append').append(table);
        });

When I switch pages, and back again.

and do append again by click button.

then div append element have duplicate data

like cache append not refresh element

how to fix it ?

Answer 1

Before append table, empty his container :

$$('#div_append').empty() or $$('#div_append').html('')