Изменение кнопки по умолчанию с помощью значка в JQuery DataTable не работает

Я использую JQUERY DataTable. В этом я пытаюсь изменить текст кнопки по умолчанию с помощью значка. Но кроме copy и Print значок других кнопок не меняется. Я использую Font Awesome для изменения текста с помощью значка. Я также добавил Font Awesome : CDN, но он не отображается для csv, excel, pdf Почему так? Мне не хватает ссылок на JQUERY?

Шрифт Awesome CDN

<link rel = "stylesheet" href = "https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css" />

Чтобы изменить текст с помощью значка

initComplete: function () {
                            $('.buttons-copy').html('<i class = "fa fa-copy" />')
                            $('.buttons-csv').html('<i class = "fa fa-file-text-o" />')
                            $('.buttons-excel').html('<i class = "fa fa-file-excel-o" />')
                            $('.buttons-pdf').html('<i class = "fa fa-file-pdf-o" />')
                            $('.buttons-print').html('<i class = "fa fa-print" />')
                        },

Полная таблица данных JQuery

function LoadTableData() {
            var params = {
                PlantCode: $('#ddlPlant').val(), CostCenterCode: $("[id$='ddlCostCenter']").val(),
                Status: $('input[name = "Status"]:checked').val(), CompanyCode: $("[id$='ddlCompany']").val()
            };
            $.ajax({
                url: 'UserService.asmx/Get_Data_Cost_Center_Master',
                method: 'post',
                data: JSON.stringify(params),
                contentType: 'application/json; charset=utf-8',
                dataType: 'json',

                success: function (data) {
                    $('#example').dataTable({
                        destroy: true,
                        data: data /*JSON.parse(data)*/,

                        columns: [
                            {
                                render: function (data, type, row, meta) {
                                    return meta.row + meta.settings._iDisplayStart + 1;
                                }
                            },
                            { 'data': 'Cost_Center', class: 'editable text' },
                            { 'data': 'Plant', class: 'editable text' },
                            { 'data': 'Status', class: 'editable text' }

                        ],
                        dom: 'Bfrtip',

                        buttons: [
                            'copy', 'csv', 'excel', 'pdf', 'print'
                        ],
                        initComplete: function () {
                            $('.buttons-copy').html('<i class = "fa fa-copy" />')
                            $('.buttons-csv').html('<i class = "fa fa-file-text-o" />')
                            $('.buttons-excel').html('<i class = "fa fa-file-excel-o" />')
                            $('.buttons-pdf').html('<i class = "fa fa-file-pdf-o" />')
                            $('.buttons-print').html('<i class = "fa fa-print" />')
                        },
                        "searching": true,
                        "paging": true,
                        "info": true,
                        "language": {
                            "emptyTable": "No data available"
                        },
                        "fnRowCallback": function (nRow, aData, iDisplayIndex) {
                            $("td:first", nRow).html(iDisplayIndex + 1);
                            return nRow;
                        },
                    })
                },
                error: function (err) { // Added this event to capture the failed requests.
                    console.info(err.responseText);
                }
            });
        };

Скриншоты

Куда я иду Неправильно? Пожалуйста, помогите мне