I don't understand very well the utility of parentNode?

Thanks Mikis

As for the first answer, are you sure there is no alternative solution?

As for the second, we used event listeners in previous courses and we didn't have to use arguments. So why do I have to use one now? And why do I have to write 'target' after it?

Yes, I'm sure that there is not another way of removing DOM Elements from the DOM Tree that does not involve the parentNode -> childNode dance. Of course, this doesn't mean that people can't create libraries that act as wrappers for such kind of tasks. In fact, the DOM itself does have an API for this called removeChild but it doesn't have sufficient cross-browser support and — like I've said — it's simply doing the parentNode -> childNode thing under the hood.

So event listeners are functions that don't return anything but get passed an Event object as an argument whenever they are called/fired. I'm not sure if you've covered objects yet in your learning but if you haven't, you should do so ASAP; not much will make any sense without this prerequisite knowledge.

In any case, if you're not going to do anything with the Event object that the Browser passes in to your event-listener anytime your chosen event is triggered, you don't have to list it as a parameter:

function (event /*this parameter can be omitted if you don't need it's data */) {
  // For instance
  // If you just wanted to log the time here or something...
  console.log(Date.now())
  // As opposed to actually using that "event" parameter to ... idk...
  // See what it is that got clicked on, or hovered on or whatever
}

This is probably the reason why you didn't see the "event" parameter in previous courses — because you didn't need it, because you weren't going to do anything with it. But now, it seems you need to know what element just got clicked on. So, now, you do need to use the Event object. Specifically, you need the target property on the Event object. If you're wondering what a property is, you need to go learn Object-Oriented Programming. For now, suffice it to say that the target property is where the Browser stores the "target" (naturally) of your event listener. The target will usually be a DOM Element but if you were listening for the scroll event or something, then it would just be the global window. Let me know if that makes sense.

Hi Bappy,

Wilfredo's question is:

Isn't it possible to remove the li's without using parentNode (and removeChild)?

The answer to this question is not:

Yes, Wilfredo. Use jQuery.

Because jQuery is just a JavaScript library — written in JavaScript. And as far as JavaScript and the DOM goes, there is only one way to remove a DOM Element.

As to the rest of your answer, you might find my response to Wilfredo's follow-up question enlightening. In the case that it's still not clear for you, feel free to ask for clarification ;)

The following is the DOM Removal code from the jQuery library —

function remove( elem, selector, keepData ) {
    var node,
        nodes = selector ? jQuery.filter( selector, elem ) : elem,
        i = 0;

    for ( ; ( node = nodes[ i ] ) != null; i++ ) {
        if ( !keepData && node.nodeType === 1 ) {
            jQuery.cleanData( getAll( node ) );
        }

        if ( node.parentNode ) {
            if ( keepData && jQuery.contains( node.ownerDocument, node ) ) {
                setGlobalEval( getAll( node, "script" ) );
            }
            node.parentNode.removeChild( node );
        }
    }

    return elem;
}

Though jQuery simplifies the process of removing a node from the DOM tree, it still relies on parentNode and removeChild to perform this action.