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

Which line here set the className of each li to 'responded' if their checkbox is checked?

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

It is working perfectly fine but I'm curious what made the className of checked items to 'responded'. or is it automatic that the className will be set to 'responded' once checked?

3 Answers

Is this all the Javascript used?

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

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

});

Yes mryoung , that's the same code as what Guil used in the video.

I realized what line it is.. Thanks mryoung for trying to help me with this :)

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

        if(checked){
            listItem.className = 'responded'; //this sets the className to 'responded' if the checkbox is checked.
                    }
            else{listItem.className = '';
                }

});

What was the line?