关于JavaScript添加类及特定HTML插入代码写法正确性的技术咨询

我在编写JavaScript代码时遇到了问题，涉及为结果添加text类。以下是我使用的ajaxForm代码片段：

$('form').ajaxForm({
    beforeSubmit: validate,
    dataType:'json',
    beforeSend: function() {
        if($('#video_type').val() == '0'){
            $('form').find('.submitBtn').text('Updating...');
            $('form').find('.submitBtn').attr('disabled','');
        }else{
            $('form').find('.card-footer').addClass('d-none');
        }
        var percentVal = '0%';
        bar.width(percentVal);
        percent.html(percentVal);
    },
    uploadProgress: function(event, position, total, percentComplete) {
        if($('#video_type').val() == '1') {
            if(percentComplete > 50) {
                percent.addClass('text-white');
            }
            var percentVal = percentComplete + '%';
            if(percentComplete == 100) {
                $('.percent').attr('style','top:2px');
                percent.html(`<i class='fas fa-spinner fa-spin'>'Processing'</i>`);
            }else{
                percent.html(percentVal);
            }
            bar.width(percentVal);
        }
    },
});

请问其中这段代码写法是否正确？

percent.html(`<i class='fas fa-spinner fa-spin'>'Processing'</i>`);

这段写法不正确，存在两个关键问题：

1. 模板字符串里使用了HTML实体<和>，浏览器会直接渲染成<和>字符，无法解析成<i>标签，导致图标不能正常显示。
2. Processing外层额外添加了单引号，最终页面会把这对单引号也显示出来，属于多余字符。

另外注意到你同时使用了percent变量和$('.percent')选择器，建议保持一致，避免变量混淆。

修正后的代码应为：

percent.html(`<i class='fas fa-spinner fa-spin'>Processing</i>`);

如果需要兼容不支持ES6模板字符串的旧浏览器，也可以用普通字符串写法：

percent.html('<i class="fas fa-spinner fa-spin">Processing</i>');

内容的提问来源于stack exchange，提问作者user12461641