Free programming examples and instructions

jQuery appent to List

Demo and code for how to add list items (append to) in list dynamically using jQuery.

by Athil

Posted on 13 May 2017 Category: jQuery Views: 857

Edited on 30 May 2017


Hi, Here Iam going to show how to append list items to a list using jQuery.

 $("#Olist").append("<li>Pine apple</li>");

Full Code


<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
    <title>Demo for append to list using jQuery</title>
      <script type="text/javascript" src="js/jquery.min.js" ></script>
    <h1>Demo for append to list using jQuery </h1>

    <ol id="Olist"> 

        <li> Apple</li>
        <li> Orange</li>
        <li> Grapes </li>

    <button id="appendbutton" onclick ="append();"> Append pinapple to list </button> 

        function append()
            $("#Olist").append("<li>Pine apple</li>");


Leave a Comment: