jQuery, html5, append()/appendTo() and IE

Question

How to replicate:

1. Create an html5 page.

2. Make sure you have the script from remysharp.com/2009/01/07/html5-enabling-script/ added so that IE wi

Answer 1

The bug is in IE's implementation of innerHTML - for some reason it doesn't like the "unknown" elements being inserted via innerHTML - whereas DOM scripting is fine.

jQuery uses creates a holding div, and then drops in the markup you want to append in via innerHTML. IE now sees the unknown elements as two new broken elements, i.e.

content

is seen as ARTICLE, #text, /ARTICLE, caused by innerHTML borking.

Here's an example, check it out in IE and you'll see that innerHTML insertion method incorrectly reports 3 nodes inserted in the div: http://jsbin.com/olizu

Screenshot for those without IE: http://leftlogic.litmusapp.com/pub/2c3ea3e