Something to realise is that once the browser loads your HTML it turns
it into a tree (the DOM, Document Object Model) of "nodes".
One thing that may help visualise this is to open up the page in
Firefox and "Inspect" the page to see what the browser is doing with
the HTML and then with the JavaScript code.
When HTML is inserted "before" (or "after") a node, the HTML is first
transformed into nodes, and since it's incomplete it ends up in an...
unusual state. The browser probably closes open tags in an effort to
make the HTML "make sense". (The following is an untested example of
what the browser might do.)
DOM:
<div id="somediv">
...
</div>
JavaScript:
$('#somediv').before('<table><tr><td>')
Altered DOM:
<table>
<tbody>
<tr>
<td></td>
</tr>
</tbody>
</table>
<div id="somediv">
...
</div>
So the "short" answer is that it's the browser that doesn't like
"incomplete/unclosed" tags. It doesn't know you're going to "close"
the tags in the next statement.
As John says, use the "wrap" function, it contains some "magic" to
make things work. Basically it creates the nodes (the TABLE, TR and TD
in this case) adds them to the same spot as the DIV then moves the DIV
into the inside of the TD (which is the "innermost" element).
You can find out more about the "magic" here:
http://docs.jquery.com/Manipulation/wrap
Karl Rudd
On Fri, Feb 22, 2008 at 12:38 PM, jquertil <[EMAIL PROTECTED]> wrote:
>
> hello again...
>
> why would this work...
> $('#somediv').before('I am just text').after('I am also just text');
> result: I am just text<div id="somediv">...</div>I am also just text
>
> but this would not?
> $('#somediv').before('<table><tr><td>').after('</td></tr></table>');
> result: <table><tr><td></td></tr></table><div id="somediv">...</div>
>
> does jQuery not like incomplete, i.e. unclosed tags?
>
> ::scratching head::
>
