0
 $(document).on('turbolinks:load', function() {
    $('.box').on("click", function() {
      alert('hello')
    });
  });

This does not work on elements with class box that are appended with ajax. It only works on the elements that are present on the initial loading of the page. I have also tried as wrappers:

$(document).ready(function() { }); 

and

var helloscript = function() { };

but nothing works.

Timmy Von Heiss
  • 1,820
  • 13
  • 31
  • Possible duplicate of [Event binding on dynamically created elements?](http://stackoverflow.com/questions/203198/event-binding-on-dynamically-created-elements) – Liam Jan 09 '17 at 08:47

2 Answers2

1

You may call it like:

$(document).on('click', '.box', function (event) {

});
Anonymous
  • 40,020
  • 8
  • 82
  • 111
codenut
  • 603
  • 7
  • 20
  • 2
    It's good practice on Stack Overflow to add an explanation as to why your solution should work. For more information read [How To Answer](http://stackoverflow.com/help/how-to-answer). – Fabian Schultz Jan 07 '17 at 19:01
0

Use correct event delegation for dinamically added elements:

 $(document).on('click', '.box', function() {
   alert('hello')
 });

You can read more about event delegation here.

Ionut
  • 10,249
  • 4
  • 33
  • 62