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
  • 2,160
  • 17
  • 39
  • 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) {

});
Moinuddin Quadri
  • 46,825
  • 13
  • 96
  • 126
codenut
  • 683
  • 1
  • 7
  • 21
  • 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 Necula
  • 11,107
  • 4
  • 45
  • 69