html() has weird behavior for divs nested inside anchors in FireFox

[Xodarap]

When I use the .html() method to set the inner html of a div which is nested inside an a in firefox 3.5, it wraps what I put inside the html with an a. Sample in firebug:

>>> $('div',$('<a><div></div></a>')).html('test').html()
"<a>test</a>"

(html should be just plain "test".) This doesn't happen in IE 8 or 7 as far as I can tell. Also doesn't happen if it's a span inside an anchor. I'm using 1.4.2, not sure about other versions.

[Xodarap]

Just to be clear: I don't mean that jQuery is setting the html wrong, because using FireFox's innerHTML gives the problem:

var x = $('div',$('<a><div></div></a>'));
x.innerHTML = 'test';
alert(x.html()); // alerts '<a>test</a>'

So I think the "bug" is that, in this instance (for reasons I don't understand), jQuery should be using the .empty().append() method instead of the .innerHTML method.

[dmethvin]

<a> is an inline element. <div> is a block element. A document with a block element inside an inline element is invalid. Invalid documents may not be rendered or processed in the way you expect.

 http://www.w3.org/TR/html401/struct/global.html#h-7.5.3

[jitter]

This is invalid for anther reason. x.innerHMTL is setting the innerHTML property on a jQuery object. You should be doing x[0].innerHTML to work on the actually DOM element.