奇怪的 JQuery 选定元素行为

我有一个简单的源块布局：

<span>
    <input type="hidden" name="first" class="cool-class" val="myValue" />
    <input type="hidden" name="second" class="fine-class" val="myValue2" />
</span>

并且有目标块的布局：

<form>
    <div id="_destination"></div>
    <button>Send</button>
</form>

并且有以下脚本，它<input>从源中选择所有元素并通过元素添加到目标块checkbox

<input type="checkbox" id="_my_check" />

$(document)
        .on('change', "#_my_check", function () {
         var cool = $(".cool-class");
         var fine = $(".fine-class");

         $("#_destination").append(cool);
         $("#_destination").append(fine);
}

因此，当执行此脚本时，元素会从源块中删除，但我需要它们保留。帮助建议。