Удалить существующий эффект перед вызовом пользовательской функции

У меня такой сценарий, как я сделал функцию для отображения сетки данных на странице, и я вызываю ее на событие готовности документа. Теперь я также дал ссылки для обновления записи, и после обновления записи я хотел бы вызвать функцию, чтобы она отображала обновленные результаты. Проблема в том, что когда я обновляю запись и возвращаю свою функцию для отображения результатов, она фактически добавляет новые после существующей таблицы. Я хочу, чтобы вспомнить последнюю запись, не добавляя новую строку. Поэтому в основном я хочу знать, как я могу отменить/отключить такую функцию, а затем вызвать ее.

ниже, как им зовут.

 //Update customers
    $("#form").on('click', "#update", function() {
        var data = $.param($("#form").serializeArray());
        event.preventDefault();
                    $.ajax({
                        type: "POST",
                        url: "crudcustomers.php",
                        data: data,
                        success: function(msg) {
                            $("#message").attr('class', 'alert alert-success');
                            $("#message").html(msg);
                            // Rebind datagrid after record added.
                            getRecords();
                        }
                    });
    });

Поэтому, если вы видите, что я переписываю datagrid с помощью getRecords(); функция. Мне нужно удалить полный набор данных, который был вызван на document.ready, а затем вызвать его в указанной выше функции.