Skip to content
techsnow

The DOM

Creating and Removing Elements

const list = document.querySelector("#todo");

const item = document.createElement("li");
item.textContent = "Learn the DOM";
item.classList.add("todo-item");

list.append(item);      // add at the end
list.prepend(item);     // or at the start

item.remove();          // delete it

Building a list from data

const courses = ["HTML", "CSS", "JavaScript"];
const ul = document.querySelector("#courses");

for (const name of courses) {
  const li = document.createElement("li");
  li.textContent = name;
  ul.append(li);
}