在当前版本中克隆 select2 元素 （4.0.13）

问：

我试图做的事情的本质已经在这个SO问题中被问到和回答了。该问题包括一个小提琴和代码，这些代码在 select2 （v3.3.2） 的早期版本中有效，但在使用当前版本 （4.0.13） 时不起作用。我使用该问题的代码创建了两个带注释的小提琴，该代码还显示了我在项目小提琴中遇到的问题和错误。

SO 问题 #17175534
v3.3.2 中的小提琴（工作）：https://jsfiddle.net/24chd7t9/
v4.0.13（损坏）：https://jsfiddle.net/ka19ez4L/

基本上，我正在尝试获得与上述问题非常相似的结果，但使用的是最新的稳定 select2 版本 （4.0.13）。切换到以前的版本会给我的项目带来一些其他问题，所以我希望在当前版本中解决这个问题。

描述：
我有一个表，每行都包含一个带有 select2 下拉列表的列。最初，该表只有一行，但有一个按钮允许用户添加行。

单击“添加”客户按钮时，将运行以下代码块。创建新行后，它会克隆 select2 元素并将其追加到新行的第二列。

$("#add-cust").click(function () {
        let table = document.getElementById("job-customers");
        let last_customer = parseInt(table.tBodies[0].rows.length, 10);
        let new_customer = last_customer+1;
        var row = table.insertRow(-1);
        row.setAttribute('id', 'row-customer-'+new_customer);
        row.setAttribute('class', 'customer');
        let cell1 = row.insertCell(-1);
        let cell2 = row.insertCell(1); 
        cell1.innerText = new_customer;

        //LOOP ROWS IN TBODY COL2 & DESTROY SELECT2 ELEMENTS
        $("#job-customers").find("tbody td:nth-child(2)").each(function () {
            $(this).children("select")
            .select2("destroy")
            .end();
        });
        //CLONE & APPEND
        $("#row-customer-" + last_customer + " td:nth-child(2)")
           .children("select").clone()
           .appendTo(cell2);
        $('.select2').select2();
    });

小提琴：（两者的代码完全相同） 使用 select2 的 JSFiddle v3.3.2：https://jsfiddle.net/07Lgxdyt/（工作） 使用 select2 的 JSFiddle v4.0.13：https://jsfiddle.net/97mrx1jL/（已损坏）

在 4.0.13 小提琴中单击“添加”后，将插入一个新行并克隆 select2 元素，但前一行的元素不再起作用。再次单击“添加”会中断所有 select2 功能，并导致以下错误：

select2（'destroy'） 方法在未被调用的元素上被调用 使用 Select2。

我怀疑这与当前版本如何在 DOM 中创建 select2 元素有关，但不确定。该代码似乎没有重新初始化 4.0.13 版本中先前销毁的 select2 元素。我尝试使用不同的选择器在前一行下拉列表上重新初始化 select2（），甚至为每个下拉列表/行编写特定的选择器，但错误消息始终相同。我在 select2 v4 的发行说明中也没有看到任何似乎适用的内容。$('.select2').select2();

在排除故障或克服此错误方面的任何帮助将不胜感激。