JQuery delegate not firing in IE8 and lower

Question

I have the following code below where I setup global variables, set elements to these variables and then assign a delegate change event on a dropdown.

The change event fires in all browsers except IE8 and lower. Not too bothered about IE7 and lower.

Any help appreciated?

$(function () {
    initialisePage();
});

function initialisePage() {
    window.portfolioGroupFilters = $("#portfolioGroupFilters");
    window.portfolioGroupsList = $("#portfolioGroupsList");
    window.portfolioGroupAccounts = $("#portfolioGroupAccounts");
    window.coverSheetsList = $("#coverSheetsList");
    window.coverSheetsPanel = $("#coverSheetsPanel");
    window.reportGroupsList = $("#reportGroupsList");
    window.reportGroupPanel = $("#reportGroupsPanel");
    window.searchResults = $("#searchResults");
    setportfolioGroupFiltersdelegates();
}

function setportfolioGroupFiltersdelegates() {
    portfolioGroupFilters.delegate(".availableFilters", "change", function () {});
}

Answer 1

If you are using jQuery 1.7 or greater, the best solution is to use on() instead of delegate() .

Your code using on() will be:

portfolioGroupFilters.on("change", ".availableFilters", function () {});

Also, it's good to know that live() is deprecated: http://api.jquery.com/live/

As of jQuery 1.7, the .live() method is deprecated. Use .on() to attach event handlers. Users of older versions of jQuery should use .delegate() in preference to .live() .