Hi Brian,

Looks like the problem is caused by these 2 lines:

                                        // insert a wrapper div after the 3rd 
paragraph (and hide it)
var $xwrapper = $('<div class="article-container"></ div>').insertAfter('#article > *:eq(2)').hide();

                                        // append all paragraphs following the 
3rd into that wrapper div
                                        $('#article > 
*:gt(2)').appendTo($xwrapper);

Because you insert $xwrapper after the third element, you're then trying to append it, along with the other elements, to itself.

try changing the second line to this:

                                        $('#article > 
*:gt(3)').appendTo($xwrapper);

that should do it.


--Karl
_________________
Karl Swedberg
www.englishrules.com
www.learningjquery.com



On Apr 15, 2008, at 9:30 AM, Brian Talbot wrote:


Thanks Karl,

That makes complete sense! I've tried to implement it by replacing all
of the instances where I'm referring to <p> elements to refer to all
direct child elements of the #article <div>, but am not getting an
error in JQuery - http://brian-talbot.com/inventingroom/jquery-expand/

"Node cannot be inserted at the specified point in the hierarchy"
code: "3"  - This happens in line 13 of the JQuery 1.2.3 framework I'm
using.

Would you happen to know why that error is happening with this new
selector placed in the code?
Thanks for your help.

-- Brian


On Apr 14, 9:02 pm, "Karl Rudd" <[EMAIL PROTECTED]> wrote:
Instead of:

   $( '#article p' )

You can use:

   $( '#article > *' )

Which will get all the immediate children (but not grandchildren) of
#article. Append ":gt()" and ":eq()" to your hearts content.

Karl Rudd

On Tue, Apr 15, 2008 at 8:00 AM, Brian Talbot <[EMAIL PROTECTED] talbot.com> wrote:

Hi All,

I was wondering if someone could help refine a content toggling
solution that I have now. As of now, the demo page below takes the
first 3 <p> elements within a parent <div> with a specific ID and
hides the remainder of the paragraphs in this parent <div> by placing
them in a newly created <div> and then creating an <a> element that
toggles the visibility of this new <div> container.

http://brian-talbot.com/inventingroom/jquery-expand/

I'd like to be able to include other elements besides <p> within the
original parent <div> and have JQuery count and display the first
three child elements (regardless of what they are) of the parent <div> and hide the remainder as it does now. Does anyone have any advice on
how to think about or execute this?

Please note: the demo above contains other elements aside from <p>
elements to demonstrate the current limitations of what I have now.

Thanks for your help as always.

Reply via email to