Laura
Laura

Reputation: 79

Append to parent

I have this HTML structure:

<ul class="shopp_categories">
    <li><a href="#">TEXT</a>
        <ul class="children">
            <li><a href="#">TEXT</a></li>
        </ul>
    </li>
    <li><a href="#">Text</a></li>
</ul>   

And this my JS:

jQuery('.shopp_categories ul.children').parent().append('###');

My function does not append the content correctly. It shall look like:

<ul class="shopp_categories">
    <li>->####<-<a href="#">TEXT</a>
        <ul class="children">
            <li><a href="#">TEXT</a></li>
        </ul>
    </li>
    <li><a href="#">Text</a></li>
</ul>   

Without the arrows, of course, after my function was executed. Where is the error in my code?

Upvotes: 1

Views: 2243

Answers (4)

xkeshav
xkeshav

Reputation: 54016

try this

$(function(){
    $('.shopp_categories li').find('ul').parent().prepend('###');
});

DEMO

Upvotes: 1

Tom Gullen
Tom Gullen

Reputation: 61729

Append will put it at the end. Prepend will put it at the beginning. Try using prepend('###'); instead.

Upvotes: 2

Grant Thomas
Grant Thomas

Reputation: 45083

What you have is invalid, to be sure, but why not use an index selector?

$(".shopp_categories li:eq(0)").prepend("###");

This way you can easily alter the index of the item you're intending to change. Simply change the value within parenthesis of eq, e.g. eq(x).

Upvotes: 1

SadullahCeran
SadullahCeran

Reputation: 2435

Your javascript is wrong.

Try that:

$(function(){
    $('.shopp_categories li:first').prepend('###');
});

Here is a working example: http://jsfiddle.net/UknL3/

Upvotes: 5

Related Questions