Hi, I m learning jquery , and I m stuck at a point.
I m trying to create a form for my practice and I want the fields to replicate itself when a + button is clicked but instead of showing the whole code I m just going to ask the part where I m having problem.
So here is the question,
I want the buttons to replicate itself when clicked. However only the first button is producing buttons but I wanted all the buttons to do the same thing.
I have written the function on CLICK of ‘replicate’ class , and when the first button produces buttons they also have the same class ‘replicate’ applied to them. Then why is this function not working on them but only working for the first button?
I was looking more for an explanation than a solution. Please help.
Event handlers aren’t replicated when you duplicate an object. You need instead to have a method that either binds it explicitly, or (as in this case) uses a “delegated events” approach.
What that means is that the event is bound to an element higher up than what is actually being acted on. In this case, document. Events “bubble” up the DOM, so this can handle new elements being added.
I recommend reading the jQuery documentation for more information: