jquery .html() does not work on ie8

Question

I have a jquery function which makes an ajax call to a webservice method on the web server, the method returns a html table with data. I am using .html() to render the return values on div. This works in Firefox,Chrome, Safari but does not work on IE8

$.ajax({
    type: "POST",
    url: "./../WebAjaxCalls.asmx/GetProductInstruction",
    data: "{'ProductID':'" + $("#txtProductID").val()  + "'}",
    success: function(data) {
        if (data.d[0] == "true") {
            **$("#dvProudctInstruction").html(data.d[1]);** 
        }
    },
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    error: function(e, textStatus, errorThrown) {
        bReturn = false;
    }
});  

The line $("#dvProudctInstruction").html(data.d[1]); works on all browsers except IE8.

Any help on this will be much appreciated.

Answer 1

You could alert your response before assigning it html()

OR

You could use innerHTML property instead html() of jquery (though it's same)

And you might want to check this link

Answer 2

It seems IE8 has problems inserting long strings of text with jQuery's html(), making the div's content just completely blank. Just tried it with both a very long string and one containing just 'blah', and that made all the difference.

So if you're expecting very large chucks of text (like 2k+ characters), go for the native innerHTML. Didn't do any further research, so I don't know what's the max length of a string to be passed through html() in IE8.