Sortable add and delete problem
Hi! I have a small JavaScript question: I have a sorted list of added items. Each item should get a link that removes the whole item. At this moment only the link by itself is removed:
- <script type="text/javascript">
$(document).ready(function(){
$("#add").click(function(event){
event.preventDefault();
var txt = $("#feld").val();
$("#sortable").append('<li class="ui-state-default" id="item"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span>'+txt+'<a href="#" id="item">delete</a><br></li>');
});
$("#item").live("click", function(event){
event.preventDefault();
$(this).remove();
});
$(function() {
$("#sortable").sortable({
placeholder: 'ui-state-highlight'});
$("#sortable").disableSelection();
});
});
</script>
</head>
<body>
<ul id="sortable">
</ul>
<input type="text" name="feld" id="feld"><br><a href="#" id="add">add</a>