One jQuery Change Event on Multiple Elements

Question

I have 3 textboxes, all with the same id's that I process into ASP by bringing it into a controller array

I have a link that adds an unlimited number of textboxes below the first 3.

My current change statement:

    $('input.#invent').change(function () {

works fine for the change event on the first textbox, but the others with the same information do not fire it when changed

What is the best strategy for getting the change event to fire when any of the 3+ textboxes change??

Answer 1

Change all three elements with the #invent ID to a class instead (ID's must to be unique), or it's only going to work for the first element, like what's currently happening in your case.

Then, you can target all of the elements that have the .invent class:

$('input.invent').change(function () {
   // Here, $(this) refers to the specific element of the .invent class which 'changed'
}):

Read more about the difference between ID and Class selectors here.