How to remove <li> </li> from ul?

How to remove a specific <li></li>ul from the list? I am adding it dynamically ... and I need to delete it when the user clicks the "Clear" button. How can i do this?

+5
source share
3 answers

It depends on what you have and what you add. Assuming you added items so they look like this:

<ul id="list">
  <li><a href="#" class="clear">clear</a></li>
  <li><a href="#" class="clear">clear</a></li>
  <li><a href="#" class="clear">clear</a></li>
</ul>

then use remove()to remove one element:

$("#list a.clear").click(function() {
  $(this).parent().remove();
  return false;
});

but if you have:

<ul id="list">
  <li>one</li>
  <li>two</li>
  <li>three</li>
</ul>
<a href-"#" id="clear">Clear</a>

and you want to clear them all, use empty():

$("#clear").click(function() {
  $("#list").empty();
  return false;
});
+9
source
$('li').remove();

li... id , , , :

$('#my_li').remove();
+3

Put a unique value in the id attribute of the element when writing it. Then you have a well-known unique access point from which you can target this element for subsequent manipulations.

+1
source