jQuery removing slash from self-closing tag

[Vic D'Elfant]

By accident, I found out that jQuery appears to be removing the closing slash from a self-closing XHTML tag when inserting this tag through .append(), .prepend() and other ways, which results in invalid XHTML which - on its turn - results in mangled markup.

The following code, for example:

$('body').append('<input type="hidden" name="test" value="test" />');

Results in the following:

<input name="test" value="test" type="hidden">

Whilst the expected output is:

<input name="test" value="test" type="hidden" />

Please see the attached file for a working POC.

[Vic D'Elfant]

Proof of Concept

[dmethvin]

Since this seems to work fine in Firefox3, I am going to assume you saw this in IE. Internet Explorer does not understand XHTML so it is treating your markup as HTML and trying to fix the invalid markup in the parser.

 http://blogs.msdn.com/ie/archive/2005/09/15/467901.aspx

If it's happening on other browsers that do support XHTML, be sure that you're serving the page as application/xml+xhtml.