How to add input on button click and create the new append a remove button to remove the new input?-CodePudding

How can i do it ?

CodePudding user response：

You could do one of two things either change your on click to search for your class everytime you click or attach an clicklistener to your element to change your onclick you could do

$('body').on('click','.remove1', remove);

or to attach to your element

 var new_input = $("<input type='text' id='new_"   new_chq_no   "'><input class='remove1' id='newbutton"   new_chq_no   "' type='button' value='x'>");
new_input.on('click',remove)

But to get your code running correctly you have to fix your remove function aswell, here's an example of how it could look

$('.add1').on('click', add);
$('body').on('click','.remove1', remove);

function add() {
  var new_chq_no = parseInt($('#total_chq').val())   1;
  var new_input = "<label><input type='text' id='new_"   new_chq_no   "'><input class='remove1' id='newbutton"   new_chq_no   "' type='button' value='x'></label>";

  $('#new_chq').append(new_input);

  $('#total_chq').val(new_chq_no);
}

function remove() {
  var last_chq_no = $('#total_chq').val();
    $(this).closest('label').remove()
  $('#total_chq'   '.remove1').val(last_chq_no - 1);
  
}