Из prompt в массив попадает новое значение, однако вместо добавления пункта в список, на страницу добавляется второй список с новым элементом, не понимаю как убрать старый список, чтобы он просто заменялся. Пробовал по разному, через .innerHTML тоже.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
<script src="main.js"></script>
</html>
let list = ["Мастер и Маргарита", "Гарри Поттер", "За пропастью во лжи", "Властелин колец", "Дюна", "Отцы и дети"]
const Header = document.createElement('h1');
Header.textContent = 'Домашняя библиотека'
document.body.append(Header)
const Addbutton = document.createElement('button');
Addbutton.textContent = 'Добавить книгу'
document.body.append(Addbutton)
const Searchbutton = document.createElement('button');
Searchbutton.textContent = 'Найти'
document.body.append(Searchbutton)
function newlist() {
const ulEl = document.createElement('ol');
for (let i = 0; i < list.length; i++) {
const liEl = document.createElement('li');
liEl.textContent = `${list[i]}`
ulEl.append(liEl)
}
document.body.append(ulEl)
}
newlist(list)
function Adding() {
list.push(prompt('Введите название книги'))
newlist()
}
Addbutton.onclick = Adding