jquery - jQueryソートは要素innerTextを削除します

Question

喜んでウィジェットを書いていたとき、突然 IE (7-9) が私の一日を台無しにしました。
一部のウィジェットは、選択ボックスを非表示にし、内部に div、ul を作成し、選択オプションに従って li で塗りつぶします。また、私のウィジェットは値をソートしますが、ここで問題が発生します。IE はリスト要素からすべての innerText を削除するため、空白の <li /> が表示されます。
それを修正する方法はありますか？それは本当に面倒です:(。例を含むjsfiddleへのリンクは次のとおりです: http://jsfiddle.net/g8Cd6/
コード:
HTML:

<select multiple="multiple" id="picked">
    <option>a</option>
    <option>b</option>
    <option>c</option>
    <option>d</option>
    <option>e</option>
</select>

JavaScript:

jQuery.fn.pick = function(sort) {
    console.log("pick_v2");
    var pick = this;
    this.widget = $('<div class="pick widget"></div>').insertAfter(this);
    this.list = $('<ul class="pick list"></ul>');
    this.widget.append(this.list);
    this.host = $(this).hide();
    var opts = this.host.children();

    for (var i = 0; i < opts.length; i++) {
        this.list.append('<li>' + opts.eq(i).text() + '</li>');
    }

    this.sort = function(container) {
        var my_options = container.children();
        my_options.sort(function(a,b) {
            if ($(a).text() > $(b).text()) return 1;
            else if ($(a).text() < $(b).text()) return -1;
            else return 0;
        });
        container.html("");
        for (var i = 0; i < my_options.length; i++) {
            console.log(my_options[i].innerText)
            container.append( my_options[i] );
        }
    };
    pick.sort(this.list);
};

$("#picked").pick(true);

アドバイスありがとう、ドラコ