"On" event does not work in IE8 with dynamically added elements

Question

I've got a grid with code below:

<div>
<table id="grid" class="display">
    <thead>
        ....
    </thead>
    <tbody></tbody>
</table>
</div>

that is filled with appropriate data via ajax requests. Some <td> elements also contain dynamically added links. So, when I'm trying to bind click event to them, it doesn't work in IE8.

var $grid = $("#grid");
...
$grid.on("click", "tbody a", function (e) {
    e.preventDefault();
    alert("clicked!");
});

It works perfectly fine everywhere except IE8.

Could someone explain me, where I'm wrong and how to solve this problem? (I'm using jQuery 1.9.1)

@Bhavesh He is correctly using the `on` method to do so. So your comment isn't true here — Oliboy50, Jul 10 '14 at 10:24
Your code should work fine. Can you create a working example of the problem in http://jsfiddle.net? — Rory McCrossan, Jul 10 '14 at 10:26
For the guys who requested a JSfiddle, here is one with ajax data loading. But since JSfiddle website will not be displayed correctly on IE8... I don't think it will really help ^^ http://jsfiddle.net/8KqU7/3/ We would also need to see the rest of your code if possible. There might be something in your CSS or with other scripts that would cause this trouble. — Niflhel, Jul 15 '14 at 20:55
Have you seen this question? It looks like preventDefault doesn't work in IE8 and jQuery just sticks a stub method in there to fill out the API interface. http://stackoverflow.com/a/20568261/605232 — Shakakai, Jul 15 '14 at 20:59

score 1 · Accepted Answer · edited May 23 '17 at 12:13

You need to write your function like following:

$grid.on("click", "tbody a", function(event) {
    event.preventDefault();
    alert("clicked!");
});

That is because in IE8 the event object is a global property (window.event) and not an argument of the handler.

Read more about your problem on Quirksmode event order and MDN Event differences.

Also on StackOverflow are a lot answers to that: Acces event target in IE8 or JavaScript IE event

"On" event does not work in IE8 with dynamically added elements

1 Answers1