Checking validity of innerHTML
HTML
<link rel="stylesheet" href="http://code.jquery.com/qunit/git/qunit.css">
<script src="http://code.jquery.com/qunit/git/qunit.js"></script>
<doctype html>
<html>
<head>
<charset="utf8">
<title>jQuery Namespace Test page</title>
</head>
<body>
<h1 id="qunit-header">QUnit example</h1>
<h2 id="qunit-banner"></h2>
<div id="qunit-testrunner-toolbar"></div>
<h2 id="qunit-userAgent"></h2>
<ol id="qunit-tests"></ol>
<div id="qunit-fixture">test markup, will be hidden</div>
</body>
</html>
JavaScript
test("Check innerHTML is preserved without namespace", function() {
var element, testHTML;
element = document.createElement('div');
testHTML = '<div></div>';
element.innerHTML = testHTML;
equals(element.innerHTML.toLowerCase(), testHTML.toLowerCase(), "We expect these to match");
});
test("Check innerHTML is preserved with namespace", function() {
var element, testHTML;
element = document.createElement('div');
testHTML = '<a:div></a:div>';
element.innerHTML = testHTML;
equals(element.innerHTML.toLowerCase(), testHTML.toLowerCase(), "We expect these to match");
});