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.

JavaScript DOM Scripting By Example Editing and Filtering Names Filter Invitees Who Have Not Responded

When I check the checkbox, it hides the li correctly, but when I uncheck, the items are not displayed back again.

My code is exactly equal to Guil's (or I think it is).

filterCheckbox.addEventListener('change', (event) => {
    const isChecked = event.target.checked;
    const lis = ul.children;
    if (isChecked) {
        for (let i = 0; i < lis.length; i += 1) {
            let li = lis[i];
            if (li.className === 'responded') {
                li.style.display = '';
            }
            else {
                li.style.display = 'none';
            }
        }
    } else {
        for (let i = 0; i < lis.length; i += 1) {
            let li = lis[i];
            li.style.display = '';
        }
    }

});

Why is it not working properly? Am I missing something?

3 Answers

You have filterCheckbox.addEventListener twice in your code. The second one doesn't have an else statement but should be deleted anyways.

You may have to post more code - or better yet a snapshot. I tried your code and it worked. It's not exactly the same in that the B in Box of filterCheckBox is uppercase, but that would have produced a different error. Is there anything in the console and can you post a snapshot?

There's nothing appearing on the console :(

Here's the snapshot

https://w.trhou.se/wl5321pzre

Ander Bil
seal-mask
.a{fill-rule:evenodd;}techdegree
Ander Bil
Full Stack JavaScript Techdegree Student 3,937 Points

I have the same problem. hides everything correctly and then it does not work after the first click. I does not show any error on the console.