event is not defined in FireFox, but ok in Chrome and IE

Question

I generate HTML using jQuery:

$("<a />")
    .append("demo")
    .click(function () { DemoFunc(event, value.Id) })

This works perfect for Chrome and IE8, but in FireFox I got an error: "event is not defined". I changed the code like this:

.attr("onclick", "DemoFunc(event, " + value.Id + ")")

It works for Firefox, but not for Chrome and IE.

DemoFunc = function (e, assocGroupId) {
    var target = (e.target) ? $(e.target) : $(e.srcElement);
    ....
}

Why!? Help!!

Answer 1

In IE and Chrome, event is resolving to window.event. Firefox doesn't have this property and instead provides an event to an event handler function by passing it as a parameter. jQuery abstracts this difference for you by providing an event object parameter in all browsers:

$("<a />")
    .append("demo")
    .click(function (evt) { DemoFunc(evt, value.Id) });

Answer 2

If you have structured your code around working with the original event rather than the jQuery event, you can use evt.originalEvent to refer to the native event.