Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

129
Views
Event watcher failing on dynamically added content

Thank you in advance for any help! :)

I am using javascript to add fields to a document but the element monitor only works on hard coded fields.

For example in the code below, lozfield is monitored for change which works fine initially. However, if you click the populate button and repopulate with exactly the same input field, the watch no longer works. In debug, the field has EVENT next to it... until it is repopulated at which point the EVENT disappears. (apologies for my probably incorrect terminology!).

$("#lozfield").change(function() {
  alert("lozfield-CHANGED");
});

$("#populate").click(function() {
  document.getElementById("lozcontainer").innerHTML = '<input type="text" id="lozfield" value="ABC">';
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="lozcontainer">
  <input type="text" id="lozfield" value="ABC">
</div>
<input id="populate" type="button" value="POPULATE">

about 4 years ago · Santiago Trujillo
1 answers
Answer question

0

You need to delegate your event to a higher element - which in your case I'd suggest is lozcontainer

$("#lozcontainer").change("#lozfield", function() {
  alert("lozfield-CHANGED");
});

$("#populate").click(function() {
  document.getElementById("lozcontainer").innerHTML = '<input type="text" id="lozfield" value="ABC">';
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="lozcontainer">
  <input type="text" id="lozfield" value="ABC">
</div>
<input id="populate" type="button" value="POPULATE">

about 4 years ago · Santiago Trujillo Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!