[jQuery] Re: selector to .wrap multiple elements in HTML

[Karl Swedberg]

Actually, Ricardo's should work if ...

1. you change var $this = this; to var $this = $(this);
2. you know for sure you'll only have two paragraphs after each h1

--Karl

____________
Karl Swedberg
www.englishrules.com
www.learningjquery.com




On Nov 12, 2008, at 9:04 PM, Adam wrote:

Ricardo,
Thanks for your response. Are you sure about this syntax? Ive tried
this and there's no result. The code is not modified at all...
-Adam


On Nov 12, 4:09 pm, ricardobeat <[EMAIL PROTECTED]> wrote:

This should work for this specific case (separated in lines for
readability):

$('h1').each(function(){
    var $this = this;
    $this
       .add( $this.next() )
       .add( $this.next().next() )
       .wrapAll('<div class="fade"></div>');

});

- ricardo

On Nov 12, 7:48 pm, Adam <[EMAIL PROTECTED]> wrote:

Karl,

Thanks very much. My bad, but what I actually need is the div wrapped

around each of the sets of h1,p,p. So, the resulting code must be:

<div class='fade'>
<h1>...</h1>
<p>...</p>
<p>...</p>
</div>

<div class='fade'>
<h1>...</h1>
<p>...</p>
<p>...</p>
</div>

I have tried a number of different things, and this function works to

wrapthe first set of 3 in the div:

$("#content h1:nth-child(1),#content p:nth-child(2),#content p:nth-
child(3)").wrapAll("<div class='fade'></div>");

so then I try to add another function towrapthe second set:

$("#content h1:nth-child(4),#content p:nth-child(5),#content p:nth-
child(6)").wrapAll("<div class='fade'></div>");

but I think the 'nth's get fouled up once the first function runs and

the results of adding the second function are very odd.

Any thoughts? Thanks (again) Karl!!

-Adam

On Nov 12, 2:14 pm, Karl Swedberg <[EMAIL PROTECTED]> wrote:

Hi Adam,

Take a look at the .wrapAll() method. that should get you closer.

You'll need to select all of the elements first, though. $('h1 + p +

p') only selects that final p. If you want towrapthe div around all
h1 and p elements, you could try $('h1,p').wrapAll('<div
class="fade"></div>');

--Karl

____________
Karl Swedbergwww.englishrules.comwww.learningjquery.com

On Nov 12, 2008, at 2:11 PM, Adam wrote:

I am trying to figure out how to select 3 elements that occur together andwrapall 3 together (not individually) in a DIV tag. This is what

I have:

<h1>...</h1>
<p>...</p>
<p>...</p>

<h1>...</h1>
<p>...</p>
<p>...</p>

and I want to turn that into:

<div class='fade'>
<h1>...</h1>
<p>...</p>
<p>...</p>

<h1>...</h1>
<p>...</p>
<p>...</p>
</div>

I have tried using the ("h1 + p + p") with .wrap, but this seems to

detect the trio, but onlywrapthe last p. How can I make itwrapthe
trio together?
Thanks!
-Adam