What exactly is "event delegation?"

A good example might be a ul, say that something needs to happen when each child element is clicked. You could add a separate event listener to each individual li element, but what if li elements are frequently added and removed from the list? Adding and removing event listeners would be annoying. The better solution is to add an event listener to the parent ul element. When the event bubbles up to the ul element, you check the event object's target property to gain a reference to the actual clicked node.
Event delegation allows you to avoid adding event listeners to specific nodes; instead, the event listener is added to one parent. That event listener analyzes events to find a match on child elements.

Event delegation allows a parent element to handle events for its children. In JavaScript, event propagation (also called "bubbling") causes the parents of an element to receive the same events as the actual target element. This means you can attach an event handler to a parent, add some code to identify the actual target, and handle the event from the parent. There are three significant advantages of doing this:

1. One handler can deal with events from any number of child elements.
2. The handler can be established even before the element(s) it will respond to.
3. Less memory will be used than having multiple handlers.

If you are using (or are allowed to use) jQuery, establishing delegated handlers is easily done using a variant of the .on() method which has an extra argument to identify the target(s) of the delegation.

I believe I am allowed to use jQuery. It sounds like what I should do is remove the function calls for the individual nodes and replace with a jQuery function that will calculate the fee when any child element is clicked. Let me know if I understood that correctly. Thank you so much.

.on() looks like JQuery. I don't have that much experience with it (I've written a little bit) and I had to put this task aside temporarily to work at my day job. I'll take a look at the JQuery API before I try to revise the program.

Thanks.

NJM

Thanks I will definitely look at this before I proceed with this. NJM

I dug up a JS/JQuery book this AM and found some nice sample code for an event delegation. Between Treehouse and this, I was able to understand and add the functionality to my project.

Thank you. I am so grateful for the help from Treehouse.

Nancy M.