// 1. Change Text Content
document.getElementById("text-demo").textContent = "Text content has been changed.";

// 2. Change HTML Content
document.getElementById("html-demo").innerHTML = "<strong>New HTML inserted!</strong>";

// 3. Clear Element Contents
document.getElementById("clear-demo").textContent = "";

// 4. Modify Attributes (using direct property access)
const img = document.getElementById("image-demo");
img.src = "hero1.jpg";
img.alt = "female superhero";

// 4b. Modify Attributes using setAttribute()
const link = document.getElementById("link-demo");
link.setAttribute("href", "https://carleton.ca/scs/");
link.setAttribute("target", "_blank");
link.textContent = "Now links to Carleton SCS site";


// 5. Update Form Values
document.getElementById("input-demo").value = "New input value";
document.getElementById("checkbox-demo").checked = true;
