jquery - z-index issue with IE AND FireFox on WordPress page? -

i've got jquery running after wordpress page loads.

jquery('[class="image responsive"]').append('<div id="switch"><img src="/js/off2.png"></div>'); jquery("#switch").css({     'position': 'absolute',     'left': '2%',     'top': '40%',     'z-index': '9' }); jquery('#switch img').click(function() {     //some code doesn't run }) 

the code runs fine , click action fires on chrome. however, when tested on ie , firefox, nothing happens on click (the #switch appended , styled properly, however). i've seen z-index bugs on internet explorer going way 2009 through 2014, neither ie 'nor firefox behaves how expected to. missing here?

you should use .on() when element created dynamically.

$('body').on('click', '#switch img', function(){   // code });