Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jQuery append to bottom of list

Tags:

jquery

prepend

Can someone lend me a hand

I have this unordered list

<ul id="nav">
<li><a href="whatwedo.aspx">WHAT WE DO</a>
<ul>
    <li><a href="development.aspx">Development</a></li>
    <li><a href="marketassessment.aspx">MARKET ASSESSMENT AND CONCEPT DEVELOPMENT</a></li>
    <li><a href="planning.aspx">DEVELOPMENT PLANNING AND OVERSIGHT</a></li>
    <li><a href="preopening.aspx">PRE-OPENING OPERATIONAL SERVICES</a></li>
    <li><a href="operations.aspx">OPERATIONAL MANAGEMENT SERVICES</a></li>
    <li><a href="turnaround.aspx">TURNAROUND SERVICES</a></li>
    <li><a href="news.aspx">NEWS</a></li>
</ul>
</li>
<li><a href="ourparks.aspx">OUR PARKS</a></li>
<li><a href="contact.aspx">CONTACT US</a></li> </ul>

And I want to add a new list to the bottom of the list.

<li class="last_link"><a href="https://projects.parc-services.com" target="blank">Login</a></li>

Would I go about it by doing something like this?

$("#nav ul").prepend("<li></li>");
like image 542
Kmack Avatar asked Jun 13 '11 18:06

Kmack


People also ask

How do you use append and prepend?

The prepend() method inserts specified content at the beginning of the selected elements. Tip: To insert content at the end of the selected elements, use the append() method.

What is the use of prepend ()?

prepend() method inserts a set of Node objects or string objects before the first child of the Element . String objects are inserted as equivalent Text nodes.

What is insertAfter in jQuery?

The insertAfter() is an inbuilt method in jQuery which is used to insert some HTML content after a specified element. The HTML content will be inserted after each occurrence of the specified element. Syntax: $(content).insertAfter(target)

What is the difference between append and appendTo in jQuery?

The append (content) method appends content to the inside of every matched element, whereas the appendTo (selector) method appends all of the matched elements to another, specified, set of elements.


1 Answers

If you want to add at the end use the append() method instead of prepend():

$('#nav ul').append('<li class="last_link"><a href="https://projects.parc-services.com" target="blank">Login</a></li>');

or as I prefer:

$('#nav ul').append(
    $('<li/>', {
        'class': 'last_link',
        html: $('<a/>', {
            href: 'https://projects.parc-services.com',
            target: '_blank',
            text: 'Login'
        })
    })
);
like image 68
Darin Dimitrov Avatar answered Oct 20 '22 00:10

Darin Dimitrov