STOP! Don't use innerShiv!

html5shiv now patches for the innerHTML issue! Update html5shiv and you won't have to use innerShiv anymore:

Even with HTML5shim, IE < 9 won't style this:

var html = "<section>Baw :(</section>";

...unless you use innerShiv:

var html = "<section>Yay! :)</section>";

innerShiv makes HTML5shim work
on innerHTML & jQuery

Get innerShiv (~1k .js)

What the hell is innerShiv?

The HTML5 shi(m|v) fixes styling HTML5 elements in old IE, but things break again when an unappended element's content is set by innerHTML, like so:

var s = document.createElement("div");
s.innerHTML = "<section>Sad section cannot be styled. :(</section>";

To fix this, pass your HTML5 through innerShiv and append the returned document fragment, instead of using innerHTML directly:

var s = document.createElement("div");
s.appendChild(innerShiv("<section>Happy section loves CSS. (:</section>"));

Can I use this with jQuery?

Yes, but pass boolean false as a second parameter.

By default, innerShiv returns a document fragment, which can mess up jQuery in some situations. To have innerShiv return a jQuery-friendly array of elements, pass boolean false as a second parameter:

$("#el").append(innerShiv("<section>Hi.</section>", false));
Fork me on GitHub