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 Adding and Removing Names RSVP Checkbox

Jeff T
seal-mask
.a{fill-rule:evenodd;}techdegree
Jeff T
Full Stack JavaScript Techdegree Student 9,532 Points
Posted by Jeff T
.a{fill-rule:evenodd;}techdegree
Jeff T
Full Stack JavaScript Techdegree Student 9,532 Points

What's the difference here? 

// What's the difference between doing this(as in the video)

ul.addEventListener('change', (e) => {
const checkbox = event.target;
const checked = checkbox.checked;
const listItem = checkbox.parentNode.parentNode;

if(checked) {
  listItem.className = 'responded';
} else {
    listItem.className = '';
  }
});

//and this

ul.addEventListener('change', (e) => {
  const li = e.target.parentNode.parentNode;
  li.className = e.target.checked ? 'responded' : '';
});

Is my solution slower or harder to understand?

1 Answer

Steven Parker
Steven Parker
229,644 Points
Steven Parker
Steven Parker
229,644 Points

Your solution looks fine. The video example probably avoids constructs like ternary expressions which are not introduced in the same course to focus specifically on the concepts being introduced in this lesson.

The more courses you take, the more often you'll notice ways to make examples more compact by combining things you've learned, since the instructor needs to show each concept without knowing which other courses have already been taken.