Search code examples
javascriptinternet-explorerinnerhtmlgetelementsbytagname

Changing content using innerHTML with a non-standard element in Internet Explorer


I have the non-standard element

<testele></testele>

In every browser except IE, this bit of JavaScript will successfully change the content of the above element

document.getElementsByTagName("testele")[0].innerHTML = 'hi';

However, if I change the <testele> to just a <span> (in the HTML and the JavaScript), it now successfully changes the content of the element in every browser, including IE.

Is there any fix? I have searched around and tried a bunch to no avail.


Solution

  • Use document.createElement("testele") before it is rendered. This script must be included before the document encouters a <testele>:

    http://jsfiddle.net/gilly3/LjwbA/

    document.createElement("testele");
    window.onload = function() {
        document.getElementsByTagName("testele")[0].innerHTML = 'hi';
    };
    

    If you try to do document.createElement("testele") after a <testele> has been parsed by the browser, it's too late.