Question

HTML

<div class="ph">
</div>
<div class="ph">
</div>

Javascript

$(function(){
    var htmlStr = '\
        <select id="OptionID" name="OptionID">\
            <option value="">--- Select ---</option>\
            <option value="1">Option 1</option>\
            <option value="2">Option 2</option>\
            <option value="3">Option 3</option>\
            <option value="4">Option 4</option>\
            <option value="5">Option 5</option>\
            <option selected="selected" value="6">Option 6</option>\
            <option value="7">Option 7</option>\
            <option value="8">Option 8</option>\
        </select>\
        ';

    $(".ph").html(htmlStr);
});

Example JSFiddle – doesn’t select Option 6 in IE8, works fine in IE9 and FF. Change the jQuery version to later than 1.4.4 and it starts working. What has changed in jQuery since 1.4.4 for this behavior? Any workaround?

EDIT

Workaround – this works

$(".ph").each(function(){
    $(this).html(htmlStr);
});

Workaround JSFiddle

Answer 1

Use workaround

$(".ph").each(function(){
    $(this).html(htmlStr);
});

Workaround JSFiddle