title: Extracting entire XML node contents using Javascript
body: <p>We have a webapp (standard Spring MVC, Java) - that I've written - that returns a response to our client (browser) as XML. The response is marshalled using JAXB and so on.</p>
  
  <p>Within the ui - to interact with 3rd party software we need to pass part of the XML as is into a javascript method.</p>
  
  <p>I.e everything from '&lt;' in thirdPartyStuff to the final closing '>' - needs to be extracted.</p>
  
  <p>After umpteen attempts and much debugging - I've come to a conclusion that this is the wrong way to do this.   I believe I should wrap that part of the response in CDATA and extract it as 
  .text() on what ever object... currently we're using jquery... the response comes back on an AJAX call...</p>
  
  <p>But maybe it can be done .. currently we're tripping over trying to call .html() on an element - which as its XML - falls in a heap.  </p>
  
  <p>TIA.</p>
  
  <p>:-)</p>
  
  <p>Below is the kind of response structure app data for "us" and 'xml' for the third part.  Only (&amp; including) from " ... to "          - needs to be extracted and passed as is (text string) to a 3rd party method.</p>
  
  <pre><code>&lt;xml&gt;
    &lt;someNode&gt;
       &lt;ourStuff veryUseful="true"/&gt;
       &lt;thirdPartyStuff a="1" b="2"&gt;
         &lt;moreStuff/&gt;
         &lt;evenMoreStuff/&gt;
       &lt;/thirdPartyStuff&gt;
    &lt;/someNode&gt;
  
  
  &lt;/xml&gt;
  </code></pre>
  
  <p>Below is a failing test, basically illustrating my ignorance.  So of course the console.log must fail.  </p>
  
  <p>In reality the data comes back via an $.ajax() call - but this test illustrates the behaviour.
  It generates a "Uncaught TypeError: Cannot call method 'replace' of undefined " - as there <em>is</em> no innerHtml on an XML "node" - which of course I believe is absolutely correct, and documented as such on the jquery API docs.</p>
  
  <p><em>Note</em> - this fails for me in Chrome &amp; IE on Windows, but works on Firefox (Mac OS)... :-|   </p>
  
  <pre><code> &lt;html&gt;
  
  &lt;head&gt;
      &lt;script src="http://code.jquery.com/jquery-1.10.1.min.js"&gt;&lt;/script&gt;
  
      &lt;script type="text/javascript"&gt;
  
          function hackit() {
              var data = "&lt;?xml version=\"1.0\" encoding=\"UTF-8\" standalone=\"yes\"?&gt;" +
                      "&lt;xml&gt;" +
                      "&lt;thirdParty&gt;" +
                      "&lt;blah a=\"0\" b=\"0\"&gt;" +
                      "&lt;/blah&gt;" +
                      "&lt;/thirdParty&gt;" +
                      "&lt;/xml&gt;";
  
              $xmlData = $.parseXML(data);
              $data = $($xmlData);
              var thing = $data.find("thirdParty");
  
              console.log(thing.html());
  
          }
      &lt;/script&gt;
  &lt;/head&gt;
  &lt;body onload="hackit()"&gt;
  
  Loaded.
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I think I will end up going this route.</p>
  
  <p><a href="https://stackoverflow.com/a/14197860/366073">https://stackoverflow.com/a/14197860/366073</a></p>