Cant clear text from textarea after button click

Programming
1

I want text to be cleared from textarea after clicking on button. I tried many things eighter applying to textarea’s value empty string, tried to reset it with reset() function but nothing seems to work, any ideas?

Here’s codepen,
https://codepen.io/bego96/pen/dydKGBE
i couldnt post more code because there’s alot of it unfortunately and theres a limit on topic that can be posted, i made multiple pages in project so im showing only one.

var nav = document.getElementById('middle-nav');
var navBtn = document.querySelector('.nav-button');

navBtn.addEventListener('click', function(e) {
    nav.classList.toggle('active');
    console.log("Hello");
});

var usercomment = document.querySelector('.article-comments-section');

usercomment.addEventListener('click', function(e) {
    if (e.target.className == "post") {
        
        e.preventDefault();
        var txtarea = document.querySelector('textarea');
            var txtareavalue = txtarea.value;
        
        var comment = document.createElement('div');
            comment.classList.add('comments');
        
        var avatar = document.createElement('div');
            avatar.classList.add('avatar');
        
        var name = document.createElement('span');
            name.textContent = "John";
        var lastname = document.createElement('span');
            lastname.textContent = "Doe";
            avatar.appendChild(name);
            avatar.appendChild(lastname);

        var commentsfield = document.createElement('div');
            commentsfield.classList.add('comments-field');
            commentsfield.textContent = txtareavalue;

        var commentsreaction = document.createElement('ul');
        commentsreaction.classList.add('comments-reaction');
            var like = document.createElement('li');
                like.classList.add('like');
            var thumbsup = document.createElement('i');
                thumbsup.classList.add('fa-solid');
                thumbsup.classList.add('fa-thumbs-up');
                like.appendChild(thumbsup);
                var likecount = document.createElement('span');
                likecount.textContent = "0";
                thumbsup.appendChild(likecount);
            var dislike = document.createElement('li');
                dislike.classList.add('dislike');
                var thumbsdown = document.createElement('i');
                    thumbsdown.classList.add('fa-solid');
                    thumbsdown.classList.add('fa-thumbs-down');
                dislike.appendChild(thumbsdown);
                var dislikecount = document.createElement('span');
                dislikecount.textContent = "0";
                thumbsdown.appendChild(dislikecount);
            var reply = document.createElement('li');
                reply.classList.add('reply');
                reply.textContent = "Reply";
            commentsreaction.appendChild(like);
            commentsreaction.appendChild(dislike);
            commentsreaction.appendChild(reply);
        

        comment.appendChild(avatar);
        comment.appendChild(commentsfield);
        comment.appendChild(commentsreaction);

        
        var commentlist = document.querySelector('.comment-list');

        commentlist.appendChild(comment);

        
    }
})
2

Do you mean clear the textarea after the submit/post? If so you can just set txtarea.value to an empty string.

3

I tried it didnt work idk why

4

lasjorg is right, you can set txtarea.value = "". I would say maybe try it at the end of function after commentlist.appendChild(comment);.

5

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.