FadeOut causes IE9 to crash

A JQUERY example of using the FadeOut function that causes IE9 to crash - OK in Firefox and Chrome

by pixelda

HTML

<h4>
        Click one or more letters then, click [Z] - Randomly, IE9 crashes</h4>
    <div id="divCharList" class="divSelectList">
    </div>

CSS

.divSelectList
{
    background-color: #ddd;
}

.divSelectList a, .spanSelectList, .spanSelectList:hover, .spanSelectListSelected
{
    text-decoration: none;
    cursor: pointer;
    color: #222;
    padding: 0 6px;
    font-size: 1.5em;
}

.divSelectList a:hover, .spanSelectList:hover, .spanSelectListSelected
{
    background-color: Gray;
    color: White;
}

JavaScript

function onCharacterSelected(event) {

    var ch = event.data.charClicked;
    var div = $("#divCharList");

    // reset selected in display
    div.children("span").each(function(index) {
        var span = $(this);

        if (span.text() == ch) {
            span.removeClass("spanSelectList").addClass("spanSelectListSelected");

            // THE FADEOUT call causes IE9 to crash - MSHTML.dll (0x0000005 - memory access error)
            span.fadeOut(200).fadeIn(200);
        }
        else {
            span.removeClass("spanSelectListSelected").addClass("spanSelectList");
        }
    });
}


var div = $("#divCharList");

var charList = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";

for (var index = 0; index < charList.length; index++) {
    div.append($("<span>" + charList[index] + "</span>"));
}

// add a click event to each child
div.children("span").each(function(index) {
    var ch = $(this);
    var txt = ch.text();

    ch.addClass("spanSelectList");

    ch.on('click', {
        charClicked: ch.text()
    }, onCharacterSelected);
});