Binding jquery to an updated element via Ajax

Question

This question has been asked but this one is a little more specific, the others didn't give me an answer, thou they helped.

I have some html code like so, it's this way AFTER the j query executes:

<td><div class="switch has-switch"><div class="switch-animate switch-off"><input type="checkbox" data-toggle="switch" data-shopify="10700" data-order="90312" class="ct-primary printing" value="0"><span class="switch-left">DONE</span><label>&nbsp;</label><span class="switch-right">NOT</span></div></div></td>

The above html is just a check box that I can check or uncheck. Using the following Jquery code the above gets the div added to it:

  $(function () {
    $('.switch').each(function () {
      $(this).bootstrapSwitch();
    });

    $('[data-toggle="switch"]').each(function () {
      $(this).wrap('<div class="switch" />').parent().bootstrapSwitch();
    });
  });
}(jQuery);

My challenge is when I pull data from Ajax it no longer works since the J query has already loaded. I've read to use "on" but I'm not sure where I would add that into this current J query code. How can I change this code to work on new elements provided by an Ajax call?

Will need to initialize plugin on new html after you load it with ajax. Show us how you are loading it — charlietfl, Jul 25 '19 at 19:32
Challenge is I am placing Ajax on an html page that already displays data. I'm trying to avoid refresh of whole page. Should I refresh the script when I do Ajax? @charlietfl — FabricioG, Jul 25 '19 at 19:33
Basically yes... But you don't want to double wrap so should only target what is added — charlietfl, Jul 25 '19 at 19:34
Read this: Understanding Event Delegation https://learn.jquery.com/events/event-delegation/ — rafaelcastrocouto, Jul 25 '19 at 20:57
Possible duplicate of [Event binding on dynamically created elements?](https://stackoverflow.com/questions/203198/event-binding-on-dynamically-created-elements) — rafaelcastrocouto, Jul 25 '19 at 20:58

Binding jquery to an updated element via Ajax

0 Answers0