UPDATE! Scroll to bottom
After some playing around with it, I found the problem to be that the plugin does not work the same in IE that it does in Chrome. In IE, the clicks are taking place on option
tags, not on the div's inner li's.
So for instance, this works in IE:
$('.list').dropkick();
$(document).on('click', '#min-price option', function(){
alert('this tag name is [' + this.tagName + ']');
});
But not in Chrome.
Perhaps you need an "if browser" type statement?
Something like:
$('.list').dropkick();
var isMSIE = /*@cc_on!@*/0;
if (isMSIE) {
$(document).on('click', '#min-price option', function(){
alert('this tag name is [' + this.tagName + ']');
});
}
else {
$('.dk_options_inner li').on('click', function(){
alert('this');
});
}
A key note about Dropkick plugin
As pointed out by rafael's answer. There is a differential in the plugin script that will cause it to crash all together in later (1.9+) versions of jQuery. You could use something like my code above to replace that line and fix the plugin for later versions of jQuery.
To learn more about detecting IE and versions in JS, THIS is by far one of the best and easiest to implement solutions I have seen.
As noted in another comment I saw, DropKick has a change
event of it's own. That would probably be the best place to utilize your code. However, this still seems to fail in IE10, but it works in 9!
$('.list').dropkick({
change: function(value, label) {
alert('label [' + label + '] = value [' + value + ']');
}
});