What I am trying to do is this. I have an unordered list. Each item
has a link to remove the item, and above is a simple form to add a new
item.
HTML:
<ul id="propertyList">
<li id="1"><a href="javascript: void(0)" title="Delete"
class="deleteProperty">Item 1</li>
<li id="2"><a href="javascript: void(0)" title="Delete"
class="deleteProperty">Item 2</li>
</ul>
jQuery Code:
i=1;
$("#addProperty").click(function()
{
// Get property values
name = $('#property_name').val();
value = $('#property_value').val();
// If both are not empty, add a property to the list
if((name != '') && (value != ''))
{
$("#propertyList").prepend('<li id="'+i+'"><a href="javascript:
void(0)" title="Delete" class="deleteProperty">'+name+value+'</
li>');
i=i+1;
}
return false;
} );
// When a delete link clicked, remove that list item from list
$("a.deleteProperty",$("#propertyList li")).click(function()
{
$(this.parentNode).remove();
} );
So basicly, I have some items in the list already, now when the delete
links are clicked these are removed. But if I add a new item, none of
the jQuery code runs at all on the new item. I did a test and it seems
it don't even know any of these functions are there. Now am I being
silly or is there a real problem?
Thanks
