Unable to change the Jquery cloned div id and removing is not working

Question

I have tried many solutions and finally am here to ask you for help.I am a beginner in JS .I have used jquery-clone to clone the row I could clone the row and I could add the remove button also, The problem I am facing is like whenever I select them or try to enter something in the cloned row fields it is not getting emptied and the first value what I entered in the parent row is showing in the cloned row fields.

The second problem I am facing is that I could add the REMOVE button when the ADD button is clicked, but when I delete the cloned row cancel button is not going.

// Clone row
$('.add_field_button').click(function() {

  if ($(".row_duplicate_remove").length >= 1) {
    $(".remove").show();
  } else {
    $(".remove").hide();
  }
  var ab = $('.row_duplicate_remove').clone(true);
  ab.removeClass('row_duplicate_remove');
  $('.clonediv').append(ab);
  event.preventDefault();
});

//remove cloned rows
$(".remove_link").click(function(e) {
  // $(this).closest(".row_duplicate").remove();
  if ($(".row_duplicate").length != 1) {
    var result = confirm("Do you Want to delete?");
    if (result) {
      $(".row_duplicate:last").remove();
    }
  }
  e.preventDefault();
});

<div class="card no-box-shadow ">
  <div class="btn-group loan-pipline-ul pipline-z-index" role="group" aria-label="Basic example">
    <button class="add_field_button btn btn-warning">Add</button>
  </div>

  <div class="card-body  clonediv" id="card-body">

    <div class="row mt-3 row_duplicate row_duplicate_remove">

      <div class="col-lg-3 col-md-6 link_div_new" id="link_div_new">
        <div class="form-group">
          <label for="">Recieved Wire:</label>
          <input type="text" name="received_wire" id="received_wire" class="form-control currency1" placeholder="Recieved Wire">
          <label for="" class="text-danger" id="received_wire_error"></label>
        </div>
      </div>

      <div class="col-lg-3 col-md-6 link_div_new" id="link_div_new">
        <div class="form-group">
          <label for="">Recieved On:</label>
          <div class="input-group small-text w-100">
            <input type="text" name="received_on" id="received_on" class="form-control mydatepicker" placeholder="--Select Date(s)--">
            <div class="input-group-append">
              <span class="input-group-text "><i class="fa fa-calendar"></i></span>
            </div>
          </div>
          <label for="" class="text-danger" id="received_on_error"></label>

        </div>
      </div>

      <div class="col-lg-3 col-md-6 link_div_new" id="link_div_new">
        <div class="form-group">
          <label for="">Recieved To:</label>
          <div class="input-group small-text w-100">
            <select class="form-control w-100" id="check_received_to" name="check_received_to" data-project="<?php echo $project_id; ?>">
              <option selected value="">--Select--</option>
              <?php foreach($recieved_to as $val): ?>

              <option value="<?php echo $val['account_number']; ?>" <?php if(isset($loan_payment_details[ 'received_to_account_number'])): ?>
                <?php if($loan_payment_details['received_to_account_number'] == $val['account_number'] ): ?> selected="selected"

                <?php endif; ?>

                <?php endif; ?> >

                <?php echo $val['account_name']; ?>
              </option>



              <?php endforeach; ?>
            </select>
          </div>
          <label for="" class="text-danger" id="received_on_error"></label>

        </div>
      </div>
      <div class="col-lg-3 col-md-6 link_div_new" id="link_div_new">
        <div class="form-group">
          <label for="">Reference #:</label>
          <div class="d-flex">
            <input type="text" name="reference_id" id="reference_id" class="form-control" placeholder="Reference #">
            <div class="remove" style="display:none">
              <a id="remove_link" class="remove_link btn btn-link text-danger"><i class="ti-close"></i></a>
            </div>
          </div>
          <label for="" class="text-danger" id="reference_id_error"></label>
        </div>
      </div>
      <div class="input_fields_wrap">
      </div>
      <div class="col-lg-12 col-md-12 excess_amount_head">
        <div class="form-group">
          <label for="">Notes:</label>
          <textarea name="notes" id="notes" rows="3" class="form-control"></textarea>
          <label for="" class="text-danger" id="payoff_amt_to_applied_error"></label>
        </div>
      </div>
    </div>
  </div>