При попытке добавлять новый HTML элемент функция добавления срабатывает только один раз, к тому же для добавления используется не то значение которое я ввожу в текстовое поле, а только дефолтное. Так как я перепробовал уже массу вариантов и с инпутом, и с событием нажатия Enter, какие-то варианты, которые уже забыл, я подозреваю, что проблема, вероятно, в appendChild, но не уверен, и не понимаю её.
HTML-----
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>HelloWorld</title>
<link rel="stylesheet" href="to_do.css">
</head>
<body>
<div class="container">
<ol class="list" id='lis'>
<li class="item">Задача</li>
<li class="item">Задача</li>
<li class="item">Задача</li>
</ol>
<!-- <textarea name="" id="ssdd" cols="30" rows="10"></textarea>
<button id="up">ok</button> -->
<textarea name="" id="" cols="30" rows="10" id="trea" class="text">Ну чё ты?</textarea>
<button onclick='submitTask()' id='pu'>ok</button>
</div>
<script defer src="to_do.js"></script>
</body>
</html>
-----
JS-----
let textarea = document.querySelector('textarea')
let list = document.querySelector('ol')
let newTask = document.createElement('li')
newTask.innerText = textarea.value
function submitTask() {
list.appendChild(newTask)
}
-----
