XML createElement не является функциональной ошибкой

Question

Я создаю небольшой веб-сайт, чтобы помочь с помощью modding Space Engineers. Файлы Sandbox.sbc вставлять или вставлять mod id легче.

Моя проблема в том, что jquery, похоже, не распознает функции appendChild или createElement. На консоли отображается сообщение об ошибке

Uncaught TypeError: $mods.appendChild is not a function 

Вот пример.

$(document).ready(function() { 
 
    $("#insertmod").click(function() { 
 
    var xml = $("#xmlTree").val(), 
 
     modID = $("#modID").val(), 
 
     xmlDoc = $.parseXML(xml), 
 
     $xml = $(xmlDoc), 
 
     $mods = $xml.find("Mods"); 
 

 
    moditem = "<ModItem><Name>" + modID + ".sbm</Name><PublishedFileId>" + modID + "</PublishedFileId></ModItem>" 
 
    $mods.appendChild(moditem); 
 
    $("#newXMLTree").val($xml); 
 
    // Append "RSS Title" to #someElement 
 
    $("#debug").append($mods.text()); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<label for="modID">Mod ID 
 
    <input type="text" name="modID" id="modID"> 
 
</label> 
 
<br> 
 
<label for="xmlTree">Current Sanbox.sbc XML 
 
    <br> 
 
    <textarea name="xmlTree" id="xmlTree" cols="30" rows="10"> 
 
    <Mods> 
 
     <ModItem> 
 
     <Name>302257706.sbm</Name> 
 
     <PublishedFileId>302257706</PublishedFileId> 
 
     </ModItem> 
 
     <ModItem> 
 
     <Name>303127240.sbm</Name> 
 
     <PublishedFileId>303127240</PublishedFileId> 
 
     </ModItem> 
 
     <ModItem> 
 
     <Name>301534203.sbm</Name> 
 
     <PublishedFileId>301534203</PublishedFileId> 
 
     </ModItem> 
 
     <ModItem> 
 
     <Name>300709199.sbm</Name> 
 
     <PublishedFileId>300709199</PublishedFileId> 
 
     </ModItem> 
 
    </Mods> 
 
    </textarea> 
 
</label> 
 
<br> 
 
<button id="insertmod">Insert Mod</button> 
 
<br> 
 
<br> 
 
<label for="newXMLTree">New Sandbox.sbc XML 
 
    <br> 
 
    <textarea name="newXMLTree" id="newXMLTree" cols="30" rows="10"></textarea> 
 
</label> 
 
<div id="debug"></div>

Я не уверен, что я делаю неправильно. Xml в первой текстовой области, как правило, намного длиннее, но я сократил ее для краткости.

В принципе, идея состоит в том, что пользователь вводит свой mod id во входное текстовое поле, а затем копирует свой текущий XML-файл Sandbox в первую текстовую область.

Когда пользователь нажимает кнопку вставки, jQuery принимает идентификатор мода, анализирует xml из первого текстового поля, находит узел xs mods и добавляет новый элемент мода в затем вставляет весь xml во вторую текстовую область, поэтому пользователь может скопировать его обратно в файл Sandbox.sbc.

Answer 1

$mods является объектом JQuery, так что нет никакого метода называется AppendChild()

$mods.append(moditem); 

Демо: Fiddle