javascript - JQuery Append Html onclick function -

im trying remove text box evenly. mean each textbox want remove button.if click remove button want delete textbox

html adding multiple text box

<pre><div id="textboxdiv1">                     <label style="float: none;"> bus model &nbsp;&nbsp;&nbsp;                     <input style="width: 150px;" type="text" value="" class="validate[required,custom[onlynumbersp]]" name="numsvalid" id="numsvalid">                     <img src="images/india_rupess.png" style="margin-left:18px;"> :</label>                     <input style="width: 150px;" type="text" value="" class="validate[required,custom[onlynumbersp]]" name="numsvalid" id="numsvalid">                     <label style="float: none;margin-left: 16px;"><span class="font-dollar">﹩</span>&nbsp; :</label>                     <input style="width: 150px;" type="text" value="" class="validate[required,custom[onlynumbersp]]" name="numsvalid" id="numsvalid">                     &nbsp;&nbsp;<a href="javascript:;" id="addbutton">add</a>&nbsp;&nbsp;<a href="javascript:;" id="removebutton">remove</a>                     </div></pre> 

this script

<pre>var counter = 2; $("#addbutton").click(function () {       $("#textboxesgroup").append('<div id="textboxdiv'  + counter +   '" class="textadd""><label style="float: none;"> bus model &nbsp;&nbsp;&nbsp;<input style="width: 150px;margin-left:3px;" type="text" value="" class="validate[required,custom[onlynumbersp]]" name="bus' + counter +   '" id="numsvalid"><img src="images/india_rupess.png" style="margin-left:21px;"> :</label><input style="width: 150px;margin-left:3px;" type="text" value="" class="validate[required,custom[onlynumbersp]]"  name="rs' + counter +   '" id="numsvalid"><label style="float: none;margin-left: 19px;"><span class="font-dollar">﹩</span>&nbsp; :</label><input style="width: 150px;margin-left:2px;" type="text" value="" class="validate[required,custom[onlynumbersp]]"  name="dollar' + counter + '" id="numsvalid">&nbsp;&nbsp;<a href="javascript:;" onclick="javascript:alert("test");"   >remove</a></div>');  counter++;; 

});

click view http://jsfiddle.net/b8drt/

you may add class on delete button , use .on() on $("#textboxesgroup") add remove event. this

    $("#textboxesgroup").on('click', '.removebutton', function(){         $(this).closest('div').remove();             }); 

and here's updated fiddle..