我有一个选择选择器多个下拉菜单工作得很好，但当我添加optgroup的第二，第三个都是由第一个optgroup值复制。
opt-groups通过js填充。

<select class="modal-input selectpicker" style="width: 75%;" data-live-search="true"
            aria-label="Select TestCases" id="select-options" multiple disabled>
</select>

使用的JS为。

$("#select-options").html("")
$("#select-options").html(`
    <optgroup label="First">
        <option>Option One</option>
    </optgroup>
    <optgroup label="Second">
        <option>Option Two</option>
        <option>Option Three</option>
    </optgroup>
`)
$("#select-options").selectpicker("refresh");

我得到的输出是

optgroup标签看起来可以工作，但是选项被复制了，我还检查了brouser inspect元素，选择输入看起来填充得很好。选择选择器在两个组中复制了相同的数据。
我可以尝试什么来解决这个问题？