Problem using elem.dataset with IE and JSFiddle

Question

In this JSFiddle I created on Chrome, I find that it's unable to work on IE (I'm using IE9). Any reason as to this: http://jsfiddle.net/ZSB67/.

var backImage = [     "http://alm7.wikispaces.com/file/view/RedBackground.bmp/144018347/RedBackground.bmp",     "http://www.time2man-up.com/wp-content/uploads/2011/07/black-background.jpg",     "http://1.bp.blogspot.com/--GorNQoEUxg/TfWPyckVeMI/AAAAAAAAAHk/0208KqQf3ds/s1600/yellow_background.jpg",     ""     ];  function changeBGImage(whichImage) {     if (document.body) {         document.body.style.background = "url(\"" + backImage[whichImage] + "\")";     } } var buttons = document.querySelectorAll('.bg_swap'),     button;  for (var i = 0; i < buttons.length; i++) {     button = buttons[i];     button.onclick = function() {         changeBGImage(this.dataset.index);     }; } 

Answer 1

IE < 10 does not support elem.dataset. You'd need to explicitly get the attribute: http://jsfiddle.net/ZSB67/1/.

changeBGImage(this.getAttribute('data-index')); 

In the future, you might want pressing F12 and looking at the console for errors, since it said what was causing the problem here.