<input id='elem' value="">
ul {
border: 1px solid red;
width: 300px;
padding: 5px;
}
li {
background-color: yellow;
padding: 1px;
list-style: none;
}
let input = document.querySelector('#elem');
let ul = document.createElement('ul');
let toDo = [];
document.body.append(ul);
input.addEventListener('change', () => {
let li = document.createElement('li');
let checkBox = document.createElement('input');
checkBox.type = 'checkbox';
checkBox.checked = false;
/* добавляем элементы списка */
li.innerHTML = input.value;
li.appendChild(checkBox);
ul.appendChild(li);
/* Очищаем input */
if (input.value == input.value) {
input.value = '';
}
/* Добавляем элементы в массив */
let elemToDo = li;
});
This Pen doesn't use any external CSS resources.
This Pen doesn't use any external JavaScript resources.