Ajax не обновляется должным образом каждый раз

Question

Я написал другой код (по крайней мере дважды), в котором Ajax должен изменять значение innerHTML с помощью вызова базы данных (GET).В то время как первые запросы преуспевают в 100% случаев (изменяя значение в базе данных), последующие команды, извлекающие новую информацию для обновления HTML-файла, дают сбой примерно в 20-30% случаев, получая неправильный ответ отxerver (старое значение).

Я попытался отследить ошибку, но не могу найти ее, так как она появляется иногда только после вызова.Следующий код является лишь важной частью моей проблемы.

<p>I like <b><span id="numCom"><?php echo liked_comments(); ?></span></b> comments.</p>

// Each comment has a likeComment and CountComments function that triggers the Ajax: 
let likeIcon = document.getElementsByClassName("like-icon");
    for(let i = 0; i < likeIcon.length; i++){
        likeIcon[i].addEventListener("click", likeComment);
        likeIcon[i].addEventListener("click", countComments);
    }


function likeComment(){
        let child = this.children[0];
        let mainID = this.parentElement.parentElement.id;
        url = "ajax/like_comment.php";
        let xhr = new XMLHttpRequest();
        xhr.open("POST", url, true);
        xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest");
        xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        xhr.onload = function(){
            if(this.status == 200){
                let result = this.responseText;
                if(result == "t"){
                    child.classList.remove("red-text");
                } else if (result == "f") {
                    child.classList.add("red-text");
                }
            }
       }
       xhr.send("com_id=" + mainID);
    }

    function countComments(){
        let numCom = document.getElementById("numCom");
        let xhr = new XMLHttpRequest();
        let url = "ajax/count_liked_comments.php";
        xhr.open("GET", url, true);
        xhr.setRequestHeader("X-Requested-With", "XMLHttpRequest");
        xhr.onload = function(){
            if(this.status == 200){
                numCom.innerHTML = this.responseText;
            }
        }
        xhr.onerror = function(){
            console.log("Error");
        };
        xhr.send();
    }

// In the php-files these functions are executed:


function like_comment($id){
    global $db;
    $check_query = "SELECT liked FROM comments WHERE comment_id = $id LIMIT 1";
    $check_result = mysqli_query($db, $check_query);
    while($stm = mysqli_fetch_array($check_result)){
        $l = $stm['liked'];
    }
    if($l == 0){
        // UPDATE TO 1
        $query = "UPDATE comments SET liked = 1 WHERE comment_id = $id LIMIT 1";
        $result = mysqli_query($db, $query);
        return $result;
    } else if($l == 1) {
        // UPDATE TO 0
        $query = "UPDATE comments SET liked = 0 WHERE comment_id = $id LIMIT 1";
        $result = mysqli_query($db, $query);
        return $result;
    } 
}

function is_liked($id){
    global $db;
    $check_query = "SELECT liked FROM comments WHERE comment_id = $id LIMIT 1";
    $check_result = mysqli_query($db, $check_query);
    while($stm = mysqli_fetch_array($check_result)){
        $l = $stm['liked'];
    }
    return $l;
}

function liked_comments(){
    global $db;
    $query = "SELECT comment_id FROM comments WHERE liked = 1";
    $result = mysqli_query($db, $query);
    return mysqli_num_rows($result);
}

Код является просто демонстрацией и не является необходимым для понимания проблемы.В другом проекте.Я изменяю значение строки таблицы через Ajax и впоследствии хочу обновить результат.Это происходит только в 70-80% случаев.Все остальные времена и старое значение возвращается