Adding event listeners to dynamically added elements using jQuery

Question

So right now  I understand that in order to attach an event listener to a dynamically added element  you have to redefine the listener after adding the element   Is there any way to bypass this  so you don t have to execute a whole extra block of code

User · Answer

document  on  click    selector   handler     Where click is an event name  and handler is an event handler  like reference to a function or anonymous function function       PS  if you know the particular node you re adding dynamic elements to - you could specify it instead of document

User · Answer

When adding new element with jquery plugin calls  you can do like the following       lt div gt     lt  div gt    hoverCard function         appendTo

User · Answer

You are dynamically generating those elements so any listener applied on page load wont be available  I have edited your fiddle with the correct solution  Basically jQuery holds the event for later binding by attaching it to the parent Element and propagating it downward to the correct dynamically created element        musics   on  change     want  function e          this  closest   from-group   val      want   is   checked       yes     no        var ans   this  val        console log      want   is   checked            http   jsfiddle net swoogie 1rkhn7ek 39

User · Answer

Using  on   you can define your function once  and it will execute for any dynamically added elements   for example       staticDiv   on  click    yourSelector   function         do something

[jquery] Adding event listeners to dynamically added elements using jQuery

Examples related to jquery

Examples related to events