Remove Field Example

HTML

<h1>Example</h1>

<button data-action="addField">Add a Field</button>

<form id="fields">
	<fieldset>
		<input type="text" name="field"><button type="button" data-action="removeField">Remove</button>
	</fieldset>

	<fieldset>
		<input type="text" name="field"><button type="button" data-action="removeField">Remove</button>
	</fieldset>

	<fieldset>
		<input type="text" name="field"><button type="button" data-action="removeField">Remove</button>
	</fieldset>

	<fieldset>
		<input type="text" name="field"><button type="button" data-action="removeField">Remove</button>
	</fieldset>
</form>

JavaScript

$(function(){

	$('[data-action="addField"]').click(function(){
			var fieldSet = '<fieldset><input type="text" name="field"><button type="button" data-action="removeField">Remove</button></fieldset>';
			$('form').append(fieldSet);
      return false;
	});

	$('[data-action="removeField"]').click(function(){
		$(this).parents('fieldset').css('background-color','red');
    return false;
	});

});