Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript DOM Scripting By Example Editing and Filtering Names Saving Names

karan Badhwar
seal-mask
.a{fill-rule:evenodd;}techdegree seal-36
karan Badhwar
Web Development Techdegree Graduate 18,135 Points
Posted by karan Badhwar
.a{fill-rule:evenodd;}techdegree seal-36
karan Badhwar
Web Development Techdegree Graduate 18,135 Points

Why my code is not working and is it an ok way to write this solution

Hi, I tried to modify the solution it is working only if I don't write

button.textContent = 'Edit'; again why is that and is my solution Ok?

   button.addEventListener('click', (e) => {
          const span = document.createElement('span');
          span.textContent = input.value;
          li.insertBefore(span, input);
          li.removeChild(input);
          button.textContent = 'Edit';

Here is a snapshot as well.

https://w.trhou.se/t8jkhbpy37

1 Answer

Bob Swaney
Bob Swaney
13,010 Points
Bob Swaney
Bob Swaney
13,010 Points

It looks to my like you are missing another 'else if' clause... i.e. else if (button.textContent === 'Save') {

then all of the stuff that the form data saves along with flipping the button back to 'Edit' }

It looks like its not working as is because you are already in a block that has a click event on the 'ul'. so when the button is clicked and it says 'Edit' it's trying to fire 2 click events due to 'Event Bubbling'. So because the button already says 'Edit', its firing the 'else if' clause which is then triggering another click event on the button that says 'Edit' and keeping the text context as 'Edit'

Hope this clarifies and is even the right answer! Good Luck!