tl;dr I've made a plugin for jQuery that makes it easy to work with XML natively in jQuery. Get the code from my GitHub.

I've been working on a project that has required me to parse and manipulate XML on the client-side. Since I was using jQuery on the project, it made sense to leverage its cross-platforminess and easy coding style to manipulate the XML.

Unfortunately, jQuery hasn't really buried its claws very deep in the XML realm because if you've tried doing anything with XML you've probably run into issues. If you don't care about IE, you'll probably have less issues, but in my case, I had to support IE and even with vanilla jQuery, some things still don't work in other browsers.

In plain old Javascript, you can manipulate XML in IE using ActiveX and the MSXML object. However, it's IE-specific and it lacks the ease of use of jQuery. I wanted a way to leverage jQuery and also support multiple browsers.

So, I've created a helper function (plugin, really?) that helps jQuery deal with the XML and any nuances it has (such as text vs. CDATA nodes, etc.).

You use it just like you normally would with jQuery with one exception:

var $xml = $.xml("<your_xml_string />");

You have to use the function I created to instantiate it.

Other than that, I've tried to make it as seamless as possible, though I have yet to test every use case. I got it far enough that it works for my project, even doing some advanced selectors and manipulation. Webkit has a bug with the appending but I'm hopeful when I sit down and look at it it'll be an easy fix. I seem to have fixed the Webkit bugs.

There are two XML-specific functions you can use when dealing with my plugin as well:

// 1. .cdata()

// Get CDATA, which will return non-encoded data
$xml.find("mynode").cdata();

// .html() has been redirected to use CDATA on XML documents
$xml.find("mynode").html();

// To set CDATA, use the cdata function
$xml.find("mynode").cdata("<strong>html</strong>");

// 2. .xml()

// Use .xml() to get the outer XML of the element
var wholeDocument = $xml.xml();

var nodeXml = $xml.find("mynode").xml();

I've posted it on GitHub for a reason. I don't exactly plan to add anything extra unless it has a bug I directly deal with in my project (after all, I made it to get the job done). However, you can totally make it better if you feel like it and I'll merge your changes to the trunk. Fork it, pull it, whatever, I welcome any additions and help.