jQuery .on() not binding event-handler
javascript, jquery
Solution
Passing `'hover'` as a string to `.on()` is no longer supported (removed in v1.9 as mentioned under the "Additional Notes" in the `.on()` documentation). The equivalent is to use `'mouseenter mouseleave'` instead, or if you just want to do something when the mouse enters the element(s) in question try:
$('#tableBody tbody').on('mouseenter', 'tr', function() {
Note that the `#tableBody` element would need to exist at the time that that runs, so you'd need to include that either in a document ready handler or in a script element at the end of the body.
And the id `'tableBody'` sounds like it is assigned to the `<tbody>` element, which doesn't make sense when your selector also includes `tbody` as a child of `#tableBody`.
Problem
I'm trying to attach an event handler to every row in a dynamically-changing table with no success (using jQuery version 1.11.0) * Edit: As many have pointed out, 'hover' is depricated, but my problem also exists with other handlers* ``` $('#tableBody tbody').on('hover', 'tr', function() { alert('hovering on a row'); }); ``` The above code is pretty much identical to the jQuery documentation- http://api.jquery.com/on/, and I've tried other variations, like ``` $(document).on('hover', '.tableRow', function(){...}); ``` The event handler just isn't getting added. I should note that the table's contents are retrieved though AJAX and then displayed, which is why I'm using the .on() method.