如何使用jQuery在replaceWith（）函数之后从mysql填充下拉列表

Question

我有一个input，当选择一个值时可以将其更改为select。选择的ID为type。我尝试使用replaceWith()方法，它起作用了。

在调用select之后，如何用数据库中的选项填充replaceWith()？

<?php
  include 'connection.php';

  $result = mysqli_query($cn, "SELECT id, product FROM table_product ORDER BY product ASC");

  $data = array();
  while ($row = mysqli_fetch_row($result))
  {
    $data[] = $row;
  }
?>

<input type="text" name="product" class="form-control" id="product" placeholder="Input Product" required>

    $(document).ready(function(){
    $('#type').change(function(){
    $("#product").replaceWith('<select type="text" name="product" class="form-control" id="product" placeholder="Input Product" required><option value="" disabled selected hidden>Select Product</option></select>');

    $.getJSON("getproduct.php", function(data) {
      $.each(data, function(index, item) {
        items += "<option value='" + item.ID + "'>" + item.Name + "</option>";
      });
      $("#product").html(items); 
    });
  });
});