Изменение dom после fetch()

Всем привет! Возник вопрос касательно всему любимой асинхронности в javascript. Я использую fetch() для отправки запрос на добавление данных и получаю в ответ распарсенный json. После чего нужно подгрузить в элемент новое значение из ответа, но так как fetch срабатывает после рендера dom, то этот элемент не подхватывается классическим document.querySelector().innerHTML, но зато $().html Хотелось бы просто узнать у знающих людей, почему так происходит. Спасибо.

Пример запроса в функции.

*
* Опциональная функция добавления в корзину
* @var selector - css селектор кнопки - инициатора добавления
 */
function addProductsInCart(selector) {
    let s = document.querySelectorAll(selector);
    if (s) {
        s.forEach(function(value, key){
            value.addEventListener("click", function(event){
                //массив id добавляемых продуктов
                const arr = this.getAttribute('data-products').split(',');

                //массив с параметрами запросов в виде x-www-form-urlencoded
                let options = [];

                //скрипт обработки запроса
                const url = '/assets/components/minishop2/action.php';
                arr.forEach(function(value,key){
                    options.push(encodeURI(`options=[]&count=1&ms2_action=cart/add&ctx=web&id=${value}`));
                })
                let i = 0;
                if(i < options.length){

                    //функция запроса, возвращающая promise. Вызов идет рекурсивно для выполнение запроса по каждой строке из options
                    postData(url, 'POST', options[i], 0)
                        .then(response => {
                            postData(url, 'POST', options[i+1])
                                .then(response => {
                                    // console.log(response.data.total_count);
                                    setTimeout(function(){
                                        miniShop2.Message.success('Товары добавлены в корзину');

                                        //именно в этому месте в селекторе .ms2_total_count необходимо записать новое значение из response. C jQuery работает ок.
                                        $('.ms2_total_count').html(response.data.total_count);

                                        //с vanilla js содержимое не меняется
                                        document.querySelector('.ms2_total_count').innerHTML = response.data.total_count;

                                        $('#msMiniCartHeaderFixed').addClass('full');
                                    }, 100)
                                })
                        });
                }
            });
        })
    }
}
addProductsInCart('.add-custom-products');

И сама функция с fetch()

/*
* Функция запроса к серверу через fetch()
* @var url - адрес запроса
* @var method - тип запрос
* @var data - тело запроса (если есть)
 */
function postData(url, method, data = ''){
        return fetch(url, {
            "credentials": "include",
            "headers": {
                "accept": "application/json, text/javascript, */*; q=0.01",
                "accept-language": "ru-RU,ru;q=0.9,en-US;q=0.8,en;q=0.7",
                "cache-control": "no-cache",
                "content-type": "application/x-www-form-urlencoded; charset=UTF-8",
                "pragma": "no-cache",
                "sec-fetch-mode": "cors",
                "sec-fetch-site": "same-origin",
                "x-requested-with": "XMLHttpRequest"
            },
            "referrer": window.location.href,
            "referrerPolicy": "no-referrer-when-downgrade",
            "body": data,
            "method": method,
            "mode": "cors"
        })
        .then(response => response.json())//возврат результат в json
}