Cart problem

tried this but didnt work:

$.ajax({
type: 'POST',
url: '/cart/add.js',
data: JSON.stringify(data),
dataType: 'json',
contentType: 'application/json',
success: function(response) {
console.log('Product added to cart:', response);
fetch(`${routes.cart_url}?section_id=cart-drawer`)
.then((response) => response.text())
.then((responseText) => {
const html = new DOMParser().parseFromString(responseText, 'text/html');
const selectors = ['cart-drawer-items', '.cart-drawer__footer'];
for (const selector of selectors) {
const targetElement = document.querySelector(selector);
const sourceElement = html.querySelector(selector);
if (targetElement && sourceElement) {
targetElement.replaceWith(sourceElement);
}
}
})
.catch((e) => {
console.error(e);
});

},
error: function(XMLHttpRequest, textStatus) {
console.error('Error adding product to cart:', textStatus);
}
});