Aquí está mi 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>

Y este es mi jQuery:

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

El #extraPerson está oculto en el css.

Agrega el div cuando se hace clic en el enlace. Sin embargo, quiero que continúe agregando el mismo div cada vez que se haga clic en el enlace. ¿Cómo hago esto? Aún mejor si agrega el número a los nombres de entrada del formulario. Ej. Nombre 3, Nombre 4, etc.