Andy Matthews wrote:
I'm getting some unexpected results using these three functions and I
wondered if this was a bug. This is what I'm trying to accomplish:
<div id="leads" class="module">
<div class="moduleHeader">
<h2>Lead Submissions</h2>
<div class="cap"></div>
</div>
</div>
I can code this manually, but I thought it would be nice to use jQuery
to remove some of the redundant code. So I first tried before and after
like so:
// jquery
$('h2', '.module').before('<div class="moduleHeader">').after('<div
class="cap"></div></div>');
<!-- html code -->
<h2>Lead Submissions</h2>
results:
<div class="moduleHeader"></div><h2>Lead Submissions</h2><div
class="cap"></div>
(you can see that jQuery "finished" my "incomplete" tag)
Why is it doing this? I know it's trying to keep "valid" code, but my
code IS valid...just not with that snippet. Anyone have any comments on
this?
I think you must not think of these methods doing some string operations
in the DOM (as if you were writing HTML). The given HTML will result in
an element, but you cannot have an opening element (as opposed to an
opening tag).
--Klaus