Ticket #1902 (closed bug: invalid)
jQuery.append mixed content gets mixed up
| Reported by: | grosensteel | Owned by: | |
|---|---|---|---|
| Priority: | major | Milestone: | 1.2.2 |
| Component: | core | Version: | 1.2.1 |
| Keywords: | Cc: | grosensteel@… | |
| Blocking: | Blocked by: |
Description
When adding mixed xml and html content to an element in the DOM, the XML and HTML code gets separated out of order.
This code demonstrates the problem:
<html xmlns=" http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<script type="text/javascript" src="../../js/lib/jquery.js"></script>
<script>
$(document).ready(function(){
var vars = $("#variables");
alert('vars before: ' + vars.html());
vars.append("<foo><p>this is p tag content inside the foo tag</p></foo>");
alert('vars after: ' + vars.html()); notice the output of this alert is that the p tag appears after the foo tag. Should appear inside it
});
</script>
</head>
<body>
<div id="variables"></div>
</body>
</html>
Change History
Please follow the bug reporting guidlines and use jsFiddle when providing test cases and demonstrations instead of pasting the code in the ticket.

I'm not sure what the foo-tag is to the HTML parser, but what may happen here is the usual tagsoup behaviour when a block element nested inside an inline element: The parser just closes the inline element and puts the block element (the p) after it. In that case there'd be nothing jQuery could do about it, you just need to fix your code.
Anyone else?