XML createElement not a function error

Question

I'm building a small website to assist with modding Space Engineers Sandbox.sbc files in or to insert mod ids easier.

My problem is that jquery doesn't seem to recognize the appendChild or createElement functions. The console displays the error message

Uncaught TypeError: $mods.appendChild is not a function

Here is an example.

$(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>

I'm not sure what I'm doing wrong. The xml in the first text area would normally be much longer but I snipped it for brevity.

Basically want the idea is that the user types their mod id into the input text box and then copies their current Sandbox xml into the first text area.

When the user hits the insert button, the jQuery takes the mod id, parses the xml from the first textarea, finds the mods xml node and appends a new mod item into an then inserts the whole xml into the second textarea so the user can copy that back into their Sandbox.sbc file.

Answer 1

$mods is a jQuery object so there is no method called appendChild()

$mods.append(moditem);

Demo: Fiddle