I'm trying to code a todo list in javascript, but somehow it doesn't work.
this is my JavaScript and HTML:
let todos = []
function createTodo() {
let newTodo = {
text: '',
checked: 0
}
newTodo['text'] = prompt('Item description')
todos.push(newTodo)
}
for (i in todos) {
let listItem = document.createElement('li')
let itemText = document.createTextNode(i['text'])
console.log('itemText: ' + itemText)
listItem.appendChild(itemText)
console.log('listItem: ' + listItem)
document.getElementById('todo-list').appendChild(listItem)
}<!DOCTYPE html>
<html>
<head>
<title>TODO App</title>
<link rel="stylesheet" type="text/css" href="./styles.css" />
</head>
<body>
<div class="container center">
<h1 class="center title">My TODO App</h1>
<div class="flow-right controls">
<span>Item count: <span id="item-count">0</span></span>
<span>Unchecked count: <span id="unchecked-count">0</span></span>
</div>
<button class="button center" onClick="createTodo();">New TODO</button>
<ul id="todo-list" class="todo-list">
</ul>
</div>
<script src="./script.js"></script>
</body>
</html>
