On click of button, append form, slide down and slide up on second click

On click of button, append form, slide down and slide up on second click

I'm trying to get a form element to slide down under a div on click of
button contained within that div.
When you click the button again, I want the form to slideUp();
So my HTML is like
<div class='cell'><div class='enquiry-button'></div></div>
<div class='cell'><div class='enquiry-button'></div></div>
<div class='cell'><div class='enquiry-button'></div></div>
Ive tried this:
$( ".enquiry-button" ).click( function(e) {
e.preventDefault();
e.stopPropagation();
$(this).closest( '.cell' ).append(
"<div class='enquiry-form'>" +
"<form>" +
"Your Email: <input type='text'
name='email'>" +
"First name: <input type='text'
name='firstname'>" +
"<br>Last name: <input type='text'
name='lastname'>" +
"<br>Contact No: <input
type='text' name='lastname'>" +
"<br>Postcode: <input type='text'
name='postcode'>" +
"<br>Optional Comment: <input
type='textarea' name='comment'>" +
"<input type='submit'
value='Submit'>"+
"</form>" +
"</div>");
$(this).closest( '.cell'
).find(".enquiry-form:last").slideDown("slow");
});
But the click function fires on every single element with the class
enquiry-button (As you'd expect).
Is there an easier way of doing this?