remove input in add new input with jQuery. how is fix it?

how can putting link add after last new input when click on remove no after last input that clicked on remove. how is it?

when yo开发者_如何学Cu clicked on remove(no last remove) you see that link add append after input. Namely we have tow or several add link after clicked on remove. you in anywhere clicked on remove append link add on input, i want only once append in last new input no in anywhere.

I hope you understand

EXAMPLE: http://jsfiddle.net/zgWr3/12/

$('a.remove_input').live('click', function (event) {
                event.preventDefault();
                var $class =  '.' + $(this).closest('div.find_input').find('div').attr('class');
                $(this).closest($class).prev().find('.adda .mediumCell').append('<a href="" class="add_input"></a>')
                $(this).closest($class).remove();
            });

With respect

For my HTML I would use something like:

<div id="inputs">
    <div id="input_container_0">
        <input type="text" name="price" placeholder="hello" />
    </div>
</div>
<div>
    <a href="Javascript:void(0);" class="action-add">add</a>
</div>

For my JavaScript I would use something like:

var number_of_inputs = 0;
$(function() {
    $(".action-add").click(function() {
        number_of_inputs++;
        $("#inputs").append('<div id="input_container_'+number_of_inputs.toString()+'"><input type="text" name="price" placeholder="hello" />&nbsp;&nbsp;<a href="Javascript:void(0);" rel="'+number_of_inputs.toString()+'" class="action-remove">remove</a></div>');
    });
    $(".action-remove").live('click', function() {
        $("#input_container_"+$(this).attr("rel")).remove();
    });
});

Hope that helps.

EDIT

Updated, so the remove link is not present for the first text box.

Here. Try this:

$(function () {
    $('a.add_input').live('click', function (event) {

        var $column = $(this).closest('div.add_units');

        // clone the top input row
        var newDiv = $($column.find('div.mediumCell').get(0)).clone(true);
        // clear field values
        newDiv.find('input').val(''); // clear the field

        // add Remove link to new row
        newDiv.append('<a href="#" class="remove_input">remove</a>');

        $column.find('div.adda').before(newDiv);

        event.preventDefault();
        return false;
    });

    $('a.remove_input').live('click', function (event) {
        event.preventDefault();
        // find row
        $row = $(this).closest('.mediumCell').remove();
    });
});