[jQuery] Insert new DOM element with new ID (index)?

[jQuery] Insert new DOM element with new ID (index)?


Hello. I trying to do a function that add a li element with a new
number (index) each time a link is clicked.
The current jQuery code looks like this:
------------------------------------------------------------------------------------
$('.new').livequery('click', function() {
    $('.item').each(function(index) {
        $('.new').before('<li class="item' + (index+2) + '">Item ' + (index
+2) + '</li>');
    });
return false;
});
------------------------------------------------------------------------------------
HTML code look like this:
------------------------------------------------------------------------------------
<li class="item">1</li>
<a href="#" class="new" title="New Item">New Item</a>
------------------------------------------------------------------------------------
It works fine the first time I click on "New Item" but then it starts
to duplicate each line. So if I have added two lines it adds four,
then eight and so on.
Any help are extremely appreciated. Thank you very much!
Best regards,
Joakim