Fantastic John!!!! Exactly what I was looking for. Thanks for the prompt
assistance. I will deploy and test tonight and let you know how I go.
I notice how prolific you are on this mailing list.......great to see people
as switched on as yourself willing to help the "intellectually less
fortunate"
Thanks again, Greg
John Resig wrote:
>
> Hi Greg -
>
> I created a plugin a while back that can help with this, called nextUntil:
>
> $.fn.nextUntil = function(expr) {
> var match = [];
>
> this.each(function(){
> var cur = this.nextSibling;
> while ( cur && jQuery.filter( expr, [cur] ).r.length ) {
> match = jQuery.merge( match, [ cur ] );
> cur = cur.nextSibling;
> }
> });
>
> return this.pushStack( match, arguments );
> };
>
> Just include that after you include jquery.js then do the following:
>
> $("#content h2").each(function(){
> $(this).nextUntil("h2").wrap("<div class='note'></div>");
> });
>
> Just 3 lines! Not too shabby :)
>
> --John
>
> On 10/18/06, Greg Bird <[EMAIL PROTECTED]> wrote:
>>
>> Hi everyone.
>>
>> I am attempting to develop some dynamic "in page" navigation. I am a big
>> fan of structural markup.
>>
>> Each H2 represents a new section of the current document.
>>
>> I wish to:
>> 1. Find each H2
>> 2. Wrap this in a unique div, up to (but not including) the next H2. This
>> will then be used to further manipulate the page
>>
>>
>>
>> <div id="content>
>> ........
>> <h2>First section</h2>
>> ...[arbitary HTML]....
>> <h2>second section</h2>
>> ...[arbitary HTML]....
>> <h2>third section</h2>
>> .........
>> </div>
>>
>> Becomes:
>> <div id="content>
>> ........
>> <div id="1">
>> <h2>First section</h2>
>> ...[arbitary HTML]....
>> </div>
>>
>> <div id="2">
>> <h2>second section</h2>
>> ...[arbitary HTML]....
>> </div>
>> <h2>third section</h2>
>> .........
>> </div>
>>
>> Here is the JQuery that I have developed to date:
>>
>> $(document).ready(function(){
>> BuildNav();
>> });
>> /*BUILD SIDE NAVIGATION*/
>> function BuildNav() {
>> //add back to top links before each H2
>> $('#content h2').each(function(i){
>> if(i==0){//FIRST H2
>> $(this).before('<div id="'+ i +'" class="note">')//START A NEW DIV WITH
>> UNIQUE ID
>> }
>> else {
>> $(this).before('</div><div id="'+ i +'" class="note">');//TERMINATE
>> PREVIOUS DIV, BEGIN NEW ONE
>> }
>> })
>> $('#content').append('</div>');//TERMINATE FINAL DIV
>> }
>>
>> This looks sensible to me but fails. It appears you cannot inject
>> unterminated tags and that JQUERY automatically closes tags on insertion,
>> resulting in:
>>
>> <div id="content>
>> ........
>> <div id="1"></div>
>> <h2>First section</h2>
>> ...[arbitary HTML]....
>> <div id="2"></div>
>> <h2>second section</h2>
>> ...[arbitary HTML]....
>> <div id="3"></div>
>> <h2>third section</h2>
>> .........
>> </div>
>>
>> Can anyone give me any clues? Thanks in advance, Greg Bird
>
> _______________________________________________
> jQuery mailing list
> [email protected]
> http://jquery.com/discuss/
>
>
--
View this message in context:
http://www.nabble.com/Please-help%21-Dynamically-Wrapping-DIV%27s-around-structural-markup.-tf2464168.html#a6869715
Sent from the JQuery mailing list archive at Nabble.com.
_______________________________________________
jQuery mailing list
[email protected]
http://jquery.com/discuss/
