Создание комментариев и добавление их в поле комментариев

Абсолютный начинающий программист здесь. Я пытаюсь создать поле комментариев, в котором все, что вы вводите в комментариях, будет храниться в другом div. Я заставил некоторые из них работать, но я смог добавить их, но они исчезли сразу после этого. Я хочу, чтобы он сохранял комментарии в блоке #comment-box, а когда вы вводите другой комментарий, он сохраняет его внизу. Вот мой код до сих пор

<div class = "container">
    <h2>Leave us a comment</h2>
    <form>
       <textarea id = "" placeholder = "Add Your Comment" value = " "></textarea>
       <div class = "btn">
           <input id = "submit" type = "submit" value = "Comment">
           <button id = "clear">  
            &#128591;</button>
       </div> 
    </form>
</div>
<div class = "comments">
    <h2>Comments</h2>
    <div id = "comment-box" value = "submit">
    </div>
</div>

и мой JS

const field = document.querySelector('textarea');
const backUp = field.getAttribute('placeholder')
const btn = document.querySelector('.btn');
const clear = document.getElementById('clear')
const submit = document.querySelector('#submit')
// const comments = document.querySelector('#comment-box')
const comments = document.getElementById('comment-box')

field.onfocus = function(){
    this.setAttribute('placeholder','')
    this.style.borderColor = '#333'
    btn.style.display = 'block'
} // when clicking on this, placeholder changes into ' '.

field.onblur = function(){
    this.setAttribute('placeholder',backUp)
} //click away, placeholder returns

clear.onclick = function(){
    btn.style.display = 'none';
    field.value = ' '

submit.onclick = function(){
    submit.style.display = 'none';
    const content = document.createTextNode(field.value)
    comments.appendChild(content)

Где я ошибаюсь, ребята? Любая обратная связь будет оценена. Благодарю вас