Here is My JSFiddle link
var counter = 1;
$(document).ready(function () {
$("#addButton").click(function () {
if (counter > 5) {
alert("Limit Exceeds");
return false;
}
var $wrap = $('#TextBoxesGroup');
var dynamichtml = "<div id='divleft_"+(counter)+"' ><div class='mcity' ><label> Leaving from</label><input type='text' name='textbox" + counter + "' id='textbox" + counter + "' class='auto'/> </div><div class='mcity'> <label> Going to</label> <input type='text' name='textbox" + counter + "' id='textbox"+ counter + 1 + "' class='auto'/> </div><div class='mcity'> <label> Going to</label> <input type='text' name='textbox" + counter + "' id='textbox" + counter + 11 + "' class='auto'/> </div></div>";
$wrap.append(dynamichtml);
counter++;
});
$("#removeButton").click(function () {
if (counter == 1) {
alert("No more textbox to remove");
return false;
}
counter--;
$("#TextBoxesGroup").find("#divleft_" + counter).remove();
});
});