Question

I have a form which contains first name and last name..

They can be cloned/duplicated by clicking “Add more” link.

Here is the code..

<form>
    <p class="clone">
    First name: <input type="text" name="fname[]" value=""><br>
Last name: <input type="text" name="lname[]" value=""><br>
    </p>
   </form>
<a href="#" class="add" rel=".clone">Add More</a>

Here is the jsfiddle demo http://jsfiddle.net/d6mYr/
​

Now i would like insert this link next to last name text form field.

<a href="#">Example</a>

Currently my form doesn’t have class attributes in the form fields. It has only name attributes.

So can anyone help me to add that link automatically using jquery?.

Answer 1

Without using that relCopy plugin

$(function() {
    var exampleLink = $('<a href="#">Example</a>')
    exampleLink.insertAfter('input[name="lname\[\]"]')

    $('a.add').click(function() {
        var removeLink = $('<a href="#" />').text('Remove').click(function() {
            $(this).parent().slideUp(function() {
                $(this).remove();
            })
        });

        var new_row = $('.clone:first').clone();
        new_row.append(removeLink)
        new_row.appendTo($(this).prev());
    });
});​

http://jsfiddle.net/d6mYr/3/