event.currentTarget.innerHTML is empty in IE10 after view is re-rendered
backbone.js, cross-browser, internet-explorer-10, javascript, jquery
Solution
I was curious so had a go. This won't answer your question but might point in the right direction
(1) In your example you replace a button with an identical button, if you replace it with different text you'll see in chrome that the innerHTML is actually the unreplaced text
(2) In IE `currentTarget` is an empty button with no parent
(3) It (sort of) works in IE and chrome if you do this:
event.delegateTarget.children[0].innerHTML
(4) doc type makes no difference either way
So your answer will be in finding the difference between delegateTarget and currentTarget, or just using delegateTarget
Problem
Here is the JSBin Demo (Please test in Chrome and IE10 to see the difference) HTML ``` <body> <div id='a'> <button>CLick me</button> </div> </body> ``` JS ``` var markup = '<button>CLick me</button>'; $('#a').on('click', 'button', function() { $('#a').html(markup); }); $('#a').on('click', 'button', function(event) { console.log(event.currentTarget.innerHTML); //.....(1) }); ``` Line (1) gives correct output in Chrome and Firefox while in IE10 I get empty string as the value of `event.currentTarget.innerHTML`. It only happens when `div(#a)` is rendered again. PS: I am using `Backbone.js` in which I re-rendered the view but to make question simpler, I have refined the problem to above mentioned by taking backbone out of picture.