Reputation: 23
I would like to use JavaScript to insert a new li element into an existing ul. The new li element would be the last item in the ul.
<div id="foo">
<div>
<ul>
<li></li>
<li></li>
....insert html here....
</ul>
</div>
</div>
Upvotes: 1
Views: 2599
Reputation: 318372
Should be as easy as
var ul = document.querySelector('#foo ul');
var li = document.createElement('li');
li.innerHTML = 'new LI';
li.className = 'someclass';
ul.appendChild(li);
or in jQuery
$('#foo ul').append( $('<li />', {text : 'new LI'}) );
Upvotes: 1
Reputation: 37
Try ".append()"
$('#foo ul').append( '<li />' );
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="foo">
<div>
<ul>
<li></li>
<li></li>
....insert html here....
</ul>
</div>
</div>
Upvotes: 0