Как перезапустить скрипт для таблицы из JS библиотеки после обновления тела tbody таблицы?

Есть скрипт библиотеки http://cdn.datatables.net/plug-ins/

, который добавляет фильтры сортировщики для таблицы:

    $(document).ready(function () {
    $('#friendTable').DataTable({

        retrieve: true,
        paging: false,
        //ajax: '/ajax/arrays.txt',
        language: {
            url: "http://cdn.datatables.net/plug-ins/1.10.20/i18n/Russian.json"
        },

        initComplete: function () {
            this.api().columns([6,8,13,14,19,21]).every(function () {
                var column = this;
                var select = $('<select><option value="">Все</option></select>')
                    .appendTo($($(column.header()))) //$(column.footer().empty())
                    .on('change', function () {
                        var val = $.fn.dataTable.util.escapeRegex(
                            $(this).val()
                        );

                        column
                            .search(val ? '^' + val + '$' : '', true, false)
                            .draw();
                    });

                $(select).click(function (e) {
                    e.stopPropagation();
                });

                column.data().unique().sort().each(function (d, j) {
                    if (column.search() === '^' + d + '$') {
                        select.append('<option value="' + d + '" selected="selected">' + d.substr(0, 30) + '</option>')
                    } else {
                        select.append('<option value="' + d + '">' + d.substr(0, 30) + '</option>')
                    }
                });
            });
        }
    });
});

В процессе, тело таблицы (tbody), к которой применяется скрипт обновляется, и после обновления tbody фильтры, которые добавляются вышеописанной функцией и библиотекой не обновляются, и сортировщики строк перестают работать:

$(function () {
    $("#SelectElectoralDistrictId").change(function () {
        var formData = { 'IdElectoralDistrict': Number.parseInt($('#SelectElectoralDistrictId').val()), 'Name': $('#SelectElectoralDistrictId>option:selected').text() };
        $('#' + 'friendTable' + ' tbody > tr').remove();

        $.ajax({
            type: 'POST',
            //    url: '@Url.Action("GetPolingStationsByElectoralDistrict")',
            url: 'Admin/SearchFriendsByElectoralDistrict/',
            headers:
            {
                'Content-Type': 'application/json',
                'RequestVerificationToken': $('#RequestVerificationToken').val()
            },
            data: JSON.stringify(formData),
            success: function (data) {

                $('#TbodyFriendTable').replaceWith(data);
                updatingFields('friendTable', 'numberRecords');

                // Генерация события для элемента FriendTable
                let elemFriendTable = document.querySelector('#friendTable')
                const eventChange = new Event("change");
                elemFriendTable.dispatchEvent(eventChange);
            },
            error: function (result, status, er) {
                alert('error: ' + result + ' status: ' + status + ' er:' + er);
            }
        });
    });
});

Сгенерировал в методе обновления tbody событие изменения для данной таблицы, но это не помогло:

 // Генерация события для элемента FriendTable
                    let elemFriendTable = document.querySelector('#friendTable')
                    const eventChange = new Event("change");
                    elemFriendTable.dispatchEvent(eventChange);

Подскажите, что нужно ещё сделать, чтобы используемая библиотека применилась уже к обновленному tbody?

Попытался повесить новый обработчик, на элемент, изменение которого, приводит к изменению тела таблицы, но это что-то не то, у нас же должно произойти все не после клика, а после возврата данных с сервера:

$('#SelectElectoralDistrictId').on('change', '#friendTable', function (e) {

    $('#friendTable').DataTable({

        retrieve: true,
        paging: false,
        language: {
            url: "http://cdn.datatables.net/plug-ins/1.10.20/i18n/Russian.json"
        },

        initComplete: function () {
            this.api().columns([6, 8, 13, 14, 19, 21]).every(function () {
                var column = this;
                var select = $('<select><option value="">Все</option></select>')
                    .appendTo($($(column.header()))) //$(column.footer().empty())
                    .on('change', function () {
                        var val = $.fn.dataTable.util.escapeRegex(
                            $(this).val()
                        );

                        column
                            .search(val ? '^' + val + '$' : '', true, false)
                            .draw();
                    });

                $(select).click(function (e) {
                    e.stopPropagation();
                });

                column.data().unique().sort().each(function (d, j) {
                    if (column.search() === '^' + d + '$') {
                        select.append('<option value="' + d + '" selected="selected">' + d.substr(0, 30) + '</option>')
                    } else {
                        select.append('<option value="' + d + '">' + d.substr(0, 30) + '</option>')
                    }
                });
            });
        }
    });
});

попробовал повесить изменение только на тело tbody таблицы, но это тоже не сработало

$('#friendTable tbody').on('change', 'tbody', function (e) { 
     $('#friendTable').DataTable({... 

Попробовал так:

 $('#friendTable tr td').on('DOMSubtreeModified', function () { 
     $('#friendTable').DataTable({...

тогда срабатывает при загрузки страницы, а при изменении тела таблицы нет.