Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.


Riks Fontein
Riks Fontein
7,523 Points

Pfff, After trying to debug my code for 2 hours, still can't find it so I am turning to you, my fellow treehousers, help

I think my code is exactly the same as Guil, not sure why it's not working. Everything seems to work till the delete button. Strange... My console said this:? Uncaught TypeError: Cannot set property 'type' of undefined Please can someone reveal for me what I am doing wrong???

// 1: Set the text of the <h1> element const h1 = document.querySelector("h1");

h1.textContent = "I am the Best";

// 2: Set the color of the <h1> to a different color h1.style.color = "red";

// 3: Set the content of the '.desc' paragraph // The content should include at least one HTML tag const p = document.querySelector(".desc");

p.innerHTML = "<i>This will be a list</i>";

// 4: Set the class of the <ul> to 'list'

const ul = document.querySelector("ul"); ul.className = "list";

// 5: Create a new list item and add it to the <ul> const li = document.createElement("li");

li.innerHTML = "<input> Hi i am a list-item";


// 6: Change all <input> elements from text fields to checkboxes

const input = document.querySelectorAll("input");

for(let i = 0; i <= input.length; i += 1) { input[i].type = "checkbox"; }

// 7: Create a <button> element, and set its text to 'Delete' // Add the <button> inside the '.extra' <div> const btn = document.createElement("button"); btn.textContent = "delete";

const extra = document.getElementsByClassName("extra"); extra.appendChild(btn);

// 8: Remove the '.extra' <div> element from the DOM when a user clicks the 'Delete' button const container = document.querySelector(".container"); btn.addEventListener(click, () => { container.removeChild(extra); })

1 Answer

Sam Gord
Sam Gord
14,060 Points

Hi, in your for loop change the condition to this

for(let i  = 0 ; i < input.length ; i++){
  input[i].type = "checkbox";

just remove that " = " and leave it to be like " < " . and it works ;)

and also here

 btn.addEventListener('click', () => { container.removeChild(extra); })

u need to put the event in quotes like this : 'click'

Riks Fontein
Riks Fontein
7,523 Points

Awesome, thanks so much it works!!