CSS not loading properly when html element appended using jquery in django template

Question

I'm working on an ecommerce app where trying to get products using ajax and append the product list using .append method and data is being appended the problem is that css doesn't load properly also icons are loading. CSS loads sometimes when hard reloaded then again not loading once refreshed normally. Please find the below codes for your reference and help to resolve.

<script>
    $.ajax({
        url: "{% url 'frontend:get_products_by_tag' tag.id tag.slug %}",
        type: "GET",
        success: function (data) {
            {#console.warn(data)#}
            $("#productsByTagProductList").empty()
            $.each(data, function (index, value) {
                    console.warn(value)
                    const productId = value.id;
                    const productName = value.name;
                    const productPrice = value.product_price;
                    const productDiscountedPrice = value.product_discounted_price;
                    const thumbnailFront = value.thumbnail_front;
                    const thumbnailBack = value.thumbnail_back;
                    const productSlug = value.slug;
                    const productBrand = value.brand;
                    const productSize = value.size;
                    const productColor = value.color;
                    const avgRating = value.avg_rating;
                    const productCategory = value.category;
                    let addToCartBtn;
                    if (productSize !== null || productColor.length !== null) {
                        addToCartBtn = '<li><a href="javascript:void(0)" 
                      class="productViewModal"' + 'data-product-id="'+productId +'"' + 
                  'title="Add to cart">' + '<i data-feather="shopping-bag"> </i></a></li>'
                    } else {
                         addToCartBtn = '<li><a href="javascript:void(0)"' + 
                      'class="addtocart-btn update-cart"' + 'data-action="add"' +
                            'data-product_id="'+productId +' "' + 'title="Add to cart">' + '<i 
                    data-feather="shopping-bag"> </i> </a></li>'
                    }
                    let price
                    if (productDiscountedPrice !== null) {
                        price = '<span class="product-price">' + 'Rs.' + productPrice + '<span 
                         class="product-discounted-price">' + ' Rs.' + productDiscountedPrice 
                            + '<span class="product-discountPercentage"' + '> (' +
                            Math.floor((100 * productDiscountedPrice) / productPrice) + '%' + 
                    'off' + ')' + '</span' + '></span>' + '</span>'
                    } else {
                        price = '<span class="product-price">' + 'Rs.' + productPrice + 
                     '<span/>'
                    }
                    $("#productsByTagProductList").append(
                        '<div>' + 
                        '<div class="product-box">' + '<div class="img-wrapper">' + '<div 
                         class="front">' + '<a href="">' + '<img src="' + thumbnailFront + '"' 
                          + 'class="bg-img blur-up lazyload" alt="">' + '</a>' + '</div>' + 
                      '<div class="back">' +
                        '<a href="">' + '<img src="' + thumbnailBack + '"' + 'class="bg-img 
                     blur-up lazyload" alt="">' + '</a>' +
                        '</div>' +
                        '<div class="product-rating-container">' + '<span>' + 
                        Math.floor(avgRating) + '</span>' + '<span class="raphaaaweb-sprite 
                          product-rating-star productRatingsExcellentIcon"></span>' +
                        '</div>' +
                        '<div class="cart-wrap">' + '<ul>' + addToCartBtn  +
                        '<li>' +
                        '<a href="javascript:void(0)" class="productViewModal"' + 'data- 
              product-id="' + productId + '"' + 'title="Quick view">' + '<i data- 
                   feather="eye"></i>' + '</a>' + '</li>' +
                        '<li>' +
                        '<a href="javascript:void(0)" class="wishlist">' + '<i data- 
                       feather="heart"></i>' + '</a>' +
                        '</li>' +
                        '</ul>' +
                        '</div>' +
                        '</div>' +
                        '<div class="product-details">' +
                        '<div>' +
                        '<a href=""' +
                        'class="font-default">' + '<h4 class="product-name">' + productName  
                      +'</h4>' + '</a>' + '</div>' +
                        '<div class="rating-details">' +
                        '<h3 class="product-category">' +
                        '{{ product.category.category|truncatechars:25 }}' +
                        '</h3>' +
                        '</div>' +
                        '<div class="main-price">' +
                        '<div class="listing-content">' +
                        '<p class="font-light">' +
                        '{{ product.short_description|truncatechars:200 }}' +
                        '</p>' + '</div>' + '<div>' + price +
                        '</div>' + 
                        '</a>' +
                        '</div>' +
                        '</div>' +
                        '</div>' +
                        '</div>'
                    )
                }
            );
        }
    });

</script>