如何将我的select2附加到div框？

Question

我想将select2追加到div box。但后来它不再起作用了。

这里的小提琴：https://jsfiddle.net/r7cop362/165/

<select class="select2" >
    <option selected="selected">Kerry</option>
    <option selected="selected">Cork</option>
</select>
<div id="box"></div>


$('.select2').select2();
$(document).ready(function () {
  $("#box").append("<select class='select2'><option selected='selected'>Cat</option><option selected='selected'>Dog</option></select>");
});

Answer 1

在追加之后再次拨打select2()：

$(document).ready(function () {
  $("#box").append("<select class='select2' ><option   selected='selected'>Cat</option><option selected='selected'>Dog</option> </select>");
  $('.select2').select2();
});

UPDATED FIDDLE

Answer 2

在附加select标签后初始化select2插件。

$(document).ready(function () {
  $("#box").append("<select class='select2' ><option   selected='selected'>Cat</option><option selected='selected'>Dog</option> </select>");
  $('.select2').select2();
});

Answer 3

$("#box").append($('.select2'));

或

$('.select2').appendTo("#box");