Question

why after each times add and remove new input link remove and add repeat several times?
like: removeremoveremoveremove or addaddaddaddaddaddadd and ...

EXAMPLE(add input and see it): http://jsfiddle.net/zgWr3/6/

$(function () {
    $('a.add_input').live('click', function (event) {
        event.preventDefault();
        var $class = '.' + $(this).closest('div.find_input').find('div').attr('class');
        var newDiv = $(this).closest($class).clone();
        $(this).closest($class).find('.add_input').remove()
        //$(this).find('.adda').remove()
        newDiv.find('.adda .mediumCell').append('<a href="" class="remove_input">remove</a>')
        newDiv.find('input').each(function () {
            $(this).prop('checked', false).val('');
        });
        $($class + ':last').after(newDiv);
        //newDiv.remove('.adda')
        //alert(newDiv)
    });

    $('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">add</a>')
        $(this).closest($class).remove();
    });
});

Answer 1

you’re cloning the div, which contains the link, then adding another.

edit: well you clone the div then add it, and append a remove_link (and a similarly for the add_link in remove). The first time there is no link, it works. The 2nd time the link exists when you call clone(), so you add a duplicate. The 3rd time 2 links exist, and you add another. And so on.

It might be best to build out the whole HTML of the field outside the function, something like:

var divHTML = \'
  <div class="field">\
    <input type="text"/>\
    <a class="remove_link">Remove</a>\
  </div>';

… then simply adding $(divHTML) inside your function, rather than this complex cloning/appending/manipulating function you have now. In any case there is probably a simpler and more straightforward way to do this.

edit 2: Something like this

var divHTML = '\
  <div class="mediumCell">\
    <input type="text" name="price" placeholder="hello" title="تعرفه"\
     class="numeric" style="width: 70px;">\
    <a class="remove_input" href="#">remove</a>\
  </div>';

$('a.add_input').live('click', function (event) {
   event.preventDefault();
   $(divHTML).insertBefore($(this));      
});

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

edit 3:

Well, you can always use your original add function and just throw a not() filter in there, so the link only gets added on the first clone:

newDiv.find('.adda .mediumCell').not(':has(.remove_input)').append('<a href="" class="remove_input">remove</a>')