Update jQuery dataTable from Firestore realtime querySnapshot

I am using jQuery dataTable in my project to show some data from Firestore. Everything working properly, the problem is that when some data is updated in Firestore, following alert is appearing in browser:

DataTables warning: table id=student-dataTable - Cannot reinitialise DataTable. 
For more information about this error, please see http://datatables.net/tn/3

I understand what the error is trying to say, but how do i solve the problem?

Following is my code:

$(document).ready(function() {
    var dataSet = [];
    let db = firebase.firestore();

    let query = db.collectionGroup("members").where("class", "==", "9");

    let observer = query.onSnapshot(function(querySnapshot){
        console.log("Got data");
        if (!querySnapshot.empty) {
            querySnapshot.forEach(function(doc) {
                dataSet.push([doc.data().memberName, doc.data().phone ]);
            });
        } else {
            console.log("querySnapshot in empty");
        }
        $('#student-dataTable').DataTable({
            data: dataSet,
            destroy: true,
            columns: [
                { title: "Name" },
                { title: "Phone" },
            ]
        });
    });    
  });

And the HTML code:

<table id="student-dataTable">

So can anyone help me on how to rebuild my Table when Firestore data updates. There is some info on this link,it's suggesting to use table.destroy(); but how do i use it to solve this?

I updated the code with destroy: true but when the table is reinitialized, all the data is pushed to dataSet variable each time, so every time data updates, each row is repeated in the table. How do the clean the dataSet variable each time.