重复的动态下拉列表

Question

我有一个动态下拉列表。我想复制它，但它不能很好地工作。 这是我的代码。 我的代码适用于从数据库中获取选项值，但它不会重复。

这是我的HTML

<div class="input-group"><label for="type">Type<br/></label>
    <select id="type">
    <option value="">Select Item</option>
    <?php 
    echo load_item(); 
    ?>
    </select>
</div>
<div id="div2"></div>

这是我的剧本：

$(document).ready(function () {
    // copy the select area
    $('#type').clone().attr('id', 'type1').attr('name', 'type1').appendTo($('#div2'));

    // make the current value selected
    $("#type1 > option[value='" + $('#type').val() + "']").attr('selected', 'selected');

});

以下是我如何获得选项值

function load_item(){
    $conn = mysqli_connect("localhost", "root", "", "atos");
    $output = ''; 
    $sql = "SELECT item_type_id,item_type FROM item_tbl";
    $results = mysqli_query($conn, $sql);
    if(mysqli_num_rows($results) > 0) {
        while ($rows = mysqli_fetch_assoc($results)) { 
            $output .='<option value="'.$rows["item_type_id"].'">'.$rows["item_type"].'</option>';
            }
    return $output;
    }
}