Having trouble making a lineThrough in a todo list. (vanillaJS)

JavaScript
1

Hello there Campers,

Having trouble trying to make a button do a lineThrough to my list items meaning i want to complete the list, not sure what is going on but it only those the first element, any guideness will be appreciated, thanks!.

Side Note: Also its a good practice to have 2 addEventListener ? like the code:
removeItems and completeItems functions


listItems.addEventListener('click', removeItems);
listItems.addEventListener('click', completeItems);

code sample bellow.

3

Hi @camperextraordinaire
So its seems it only does the last element of the NodeList, and if i do inside the for loop it does all at the same time, I’m sure im missing something i might not know a stepback.
So i changed the id attributes to classes, and have then iterate each one of them.

 function completeItems(event){
    if( event.target && event.target.nodeName === 'BUTTON' && event.target.classList.contains('complete') ){

        var complete = document.querySelectorAll('.crossing');
        for( var j = 0; j < complete.length; j++ ){
          var elComplete = complete[j];
        }
        //myCross.classList.toggle('lineThrough');
        if( elComplete.classList.contains('lineThrough')){
            elComplete.classList.remove('lineThrough');
        }else{
          elComplete.classList.add('lineThrough');
        }
    }

};