克隆输入而没有其值

Question

I want to clone a div and don't want to get the value of cloned input using jquery and ejs..the problem is when I create the array when in the cloned div I get everything ok except the time input I hot the second input only I want to get the value of third time for example

I've tried to empty the value of time input like this Javascript clone without values but it doesn't work.

var state ='', type='', time= '';
  $('#state').change(function () {
     state = this.value;
  })
  $('#type').change(function () {
     type = this.value;
  })

  $('#addToilet').click(function () {
        setTimeout(function () {
          console.log( $('#toiletTime').val());
          time = '';
          $('#toiletContent').clone(true).appendTo('.another');
           time = $("#toiletTime").val();
           console.log(state);
             toilet.push({state, type, time});
             console.log('kk',toilet);
    },100)
})

my HTML:

 <label>Toilet State</label>
          <select class="form-control col-md-6" id="state" name="">
            <option disabled selected>Select the State..</option>
            <option value="Urine">Urine</option>
            <option value="Stool">Stool</option>
          </select>
          <label>Time</label>
          <input type="time" class="form-control col-md-6" id="toiletTime" name="" value="">
          <label>Type</label>
          <select class="form-control col-md-6" id="type" name="">
            <option disabled selected>Select the Type..</option>
            <option value="Kind">Kind</option>
          </select>
       </div>
     </div>
  <div class="another">
    <p class="addNew" hidden>Add Another One</p>
  </div>

Answer 1

flush the value after cloning

$('#toiletContent').clone(true).val('').appendTo('.another');

better if you put the cloned item into a var and after append it

var clonedItem = $('#toiletContent').clone(true);

clonedItem.val('').appendTo('.another');