Dynamic form - DOM manipulation

I have a form where new input fields can be added via an add link. Each newly added input field can also be removed via a remove link.

What can I do so that the add and remove link is only shown for the input field that was added last?

Example: jsfiddle - my code

$(function() {
    $('a.add_input').live('click', function(event) {
        event.preventDefault();
        var $class = '.' + $(this).closest('div.find_input').find('div').attr('class');
        var newDiv = $($class).find('div:first').clone();
      开发者_如何学C  //alert(newDiv)                
        newDiv.append('<a href="" class="remove_input">remove</a>')
        newDiv.find('input').each(function() {
            $(this).val('');
        });
        $($class + ':first div:last').before(newDiv);
        $(this).prev('a.add_input').remove();
        alert(ok)
    });

    $('a.remove_input').live('click', function(event) {
        event.preventDefault();
        $(this).closest('div').remove();
    });
});

---

Remove all but the last .add_input from the collection:

$(this).closest('.find_input').find('.add_input:not(:last)').remove();