Как использовать jQuery для динамического добавления элементов формы

Вот мой HTML:

<div id="extraPerson">
    <div class="controls controls-row">
      <input class="span3" placeholder="First Name" type="text" name="firstname2">
      <input class="span3" placeholder="Last Name" type="text" name="lastname2">     
         <select class="span2" name="gender2"><option value="Male">Male</option><option           value="Female">Female</option></select>   
        ...ETC
    </div>
</div>

<a href="#" id="addRow"><i class="icon-plus-sign icon-white"></i> Add another family member</p></a>

И это мой JQuery:

<script>
    $(document).ready(function(){
        $('#addRow').click(function(){
            $("#extraPerson").slideDown();
         });
    })
</script>

#ExtraPerson скрыт в css.

Это добавляет div, когда ссылка нажата. Тем не менее, я хочу, чтобы он продолжал добавлять один и тот же div каждый раз при нажатии на ссылку. Как мне это сделать? Еще лучше, если он добавляет число к имени ввода формы. Например, имя3, имя4 и т. Д.

Ответы на вопрос(3)

Ваш ответ на вопрос