Question

Ok people can make a list on my website by pushing the ADD button. the code to do this is as follows (using jquery):

<script type="text/javascript">
 function voegToe(){
 $('#sortable1').append("<li class='ui-state-default'>" + $('#product').html() + $('#eiwit').html() + " <button id='voegtoe' class='zoek' type='button' onClick='deleteObject();'>del</button></li>");
 }
</script>

so pushing the button adds a LI element in the UL#sortable1 which also has a delete button in it. Now I want to make an event that when the users clicks the delete button of a certain list item, that list items is removed from the list.

How can I do this? because now when a list is made, all the li id’s or classes are the same, so I can’t use that to specify which element should be removed. So how can I say: delete only the LI of which the delete button was pressed?

    <script type="text/javascript">
     function voegToe(){
      $('??????').remove();
     }
    </script>

Answer 1

$('.zoek').live('click', function() {
    $(this).parent().remove();
});