Jquery - sliding down an dynamic, appended element

I’ve looked on site after site and can’t seem to get this to work based on others examples. I’ve had something working but unfortunately it targets the parent element and not the single appended element that I want.

Here’s the javascript:


	function duplicateField() {
		var assoc   = $(this).attr('data-association');
    	var content = $('#' + assoc + '_fields_template').html();
    	var regexp  = new RegExp('new_' + assoc, 'g');
		var new_id = $(this).closest('div.listing_box').find('div.form_row').length

    	$(this).closest('div.listing_box').find('fieldset').append(content.replace(regexp, new_id));
    	return false;
	}

	$('#new_member_button').click(duplicateField);


And here’s the html:
Base html


	<div class="listing_box half">
		<h2><a href="#"><img src="/images/plus.png" id="new_member_button" data-association="project_members" /></a>
			Members</h2>
		<div class="content">
			<fieldset>
			<!-- partial gets inserted here -->
			</fieldset>
		</div>
	</div>

Partial


<div class="form_row">
	<div class="large">
		<%= f.label :label, "member name" %>
		<label for="label">member name</label>
		<input type="text" id="label" class="project_member_field" autocomplete="off" />
		<input type="hidden" id="user_id" class="project_member_id" />
		<input type="hidden" id="_destroy" />
	</div>
	<div class="small">
		<a href="#" class="recessed_button project_member_destroy"><img src="/images/trans_x.png" /></a>
	</div>
</div>

So I’ve tried adding .hide() to the new generated content when defining var content, but still can’t chain the slideDown method to the end of the line because it’s targeting the .listing_box div. I’m completely stumped and if anyone can offer a hint or a suggestion, it’d be MOST appreciated.

Thanks.