prototype update() not working in IE

as the title suggests i have problem with prototype's update function in all IE version but its working in FF and chrome

this doesnt work

var element = $('mainnav_h');
element.cleanWhitespace();
var html = element.firstChild.innerHTML;
html = html.gsub('<span class="sep"></span>', '');
element.firstChild.update(html);//this doesn't word

but this works

var element = $('mainnav_h');
element.cleanWhitespace();
var html = element.firstChild.innerHTML;
html = html.gsub('<span c开发者_如何学运维lass="sep"></span>', '');
element.firstChild.update("this works");

source

<div class="innerNavigation_horizontal clear">
    <ul id="mainnav_h">
        <li><span class="sep"></span><a href="#" title="#">items</a></li>
    </ul></div>

you can see clearly when i pass variable to update() function is doesn't work in IE where as when i pass string in to it it works in IE, can some one explain this absurd IE behaviour

salman

---

My guess is that the problem is not with update(), but with one of the preceding functions that work on the HTML.

Can you do a test output of html using alert() at every stage of the script? Does it contain anything in the first place?

What does #mainnav_h look like? Can you post source?

Does element.firstChild actually exist? Can you check using

alert(typeof element.firstChild);

Do you get any error messages in IE?

---

In this case, the problem was obviously related to HTML casing/syntax, but for other Googlers arriving here, I can recommend disabling IE Compatibility Mode. I could easily recreate the problem in the IE-console (F12) by executing:

Document Mode IE7 standards:

>> span = document.createElement("span");
[object] {
    nextSibling : ,
    onresizeend : null,
    onrowenter : null,
    aria-haspopup : "",
    childNodes : [object],
    ondragleave : null,
    oncut : null,
    clientHeight : 0,
    onbeforepaste : null,
    ondragover : null
    ...
} 
>> span.update() 
"Object doesn't support property or method 'update'"

Document Mode IE9 standards:

>> span = document.createElement("span"); 
[object] {
    nextSibling : ,
    onresizeend : null,
    onrowenter : null,
    aria-haspopup : "",
    childNodes : [object],
    ondragleave : null,
    oncut : null,
    clientHeight : 0,
    onbeforepaste : null,
    ondragover : null
    ...
} 
>> span.update()
[object] {
    nextSibling : ,
    onresizeend : null,
    onrowenter : null,
    aria-haspopup : "",
    childNodes : [object],
    ondragleave : null,
    oncut : null,
    clientHeight : 0,
    onbeforepaste : null,
    ondragover : null
    ...
}

This will, of course, only work when running the console on a site that has loaded the prototype framework, e.g. www.redmine.org.