Comments feauter with JavaScript: who knows why condition on line 53 doesn't work?

Question

I add text "You are answering:" in to block #aname, then it is checked if there is such text in that block, then the code should be executed but it doesn't. This is first time I'm writing on JavaScript so maybe the code seems trash but anyway want to understand what the problem is here otherwise I need to rewrite the hole code in a different way.

let comments = [];

document.getElementById('comment-button').onclick = function() {    
    event.preventDefault();
    let commentatorsName = document.getElementById('cname');
    let commentatorsEmail = document.getElementById('cmail');
    let commentatorsMessage = document.getElementById('cmsg');

    let comment = {
        name : commentatorsName.value,
        email : commentatorsEmail.value,
        msg : commentatorsMessage.value,
        time : Math.floor(Date.now()/1000)
    }
    commentatorsName.value = '';
    commentatorsEmail.value = '';
    commentatorsMessage.value = '';
    comments.push(comment);
    showComments();
}
//Adding text to aname div block in html
let amountAnswers = document.getElementsByClassName('reply').length;
for (let i = 0; i < amountAnswers; i++){
    document.getElementsByClassName('reply')[i].onclick = function() {
        console.log('This never happens');
        let tag = document.getElementById("aname");
        let text = document.createTextNode("You are answering:");
        tag.appendChild(text);
    }
}

function showComments() {
    let commentsField = document.getElementById('commentsField');
    let out = '';   
    let itbe = document.getElementById('aname');
    //This condition is written correctly but doesnt work for some unknown reason
    console.log('itbe: ' + itbe.textContent);
    if (itbe.textContent.includes("You are answering:")) {
            comments.forEach(function(item) {
                out += `<p class="time"><em>answered ${item.time}</em></p>`;
                out += `<p class="name" style="margin-left: 27px;"> From: <strong>${item.name}</strong></p>`;
                out += `<p class="message" style="margin-left: 27px;">${item.msg}<br><button class="reply" type="submit" style="background: transparent; margin-left: 30px;">Reply</button></p><br>`;
            });
            commentsField.innerHTML = out;
    }
    //It runs this code instead 
    else {
        comments.forEach(function(item) {
            out += `<p class="time"><em>${item.time}</em></p>`;
            out += `<p class="name">From: <strong>${item.name}</strong></p>`;
            out += `<p class="message">${item.msg}<br><button class="reply" type="submit" style="background: transparent; margin-left: 30px;">Reply</button></p><br>`;
        });
        commentsField.innerHTML = out;
    }
    
}
 

<p id="comlabel">Comments<p>

        <div id="commentsField">
        </div>
        
        <form>
        <div id="aname">
        </div>
        
            <ul>
                <li>
                    <label for="cname">Name:</label>
                    <input type="text" id="cname" name="user_name"  />
                </li>
                <li>
                    <label for="cmail">E-mail:</label>
                    <input type="email" id="cmail" name="user_mail" />
                </li>
                <li>
                    <label for="cmsg">Message:</label>
                    <textarea id="cmsg" name="user_message"></textarea>
                </li>
                <li class="button">
                    <button type="submit" id="comment-button">Send message</button>
                </li>
            </ul>
        </form>
        <script src="scripts.js"></script>