Find all elements with class = "x" and POST for the server for the INSERT database

Question

Given the large text block from WYSIWYG, for example:

Lorem ipsum dolor sit amet, <span class="X" id="12">consectetur adipiscing elit</span>. Donec interdum, neque at posuere scelerisque, justo tortor tempus diam, eu hendrerit libero velit sed magna. Morbi laoreet <span class="X" id="13">tincidunt quam in facilisis.</span> Cras lacinia turpis viverra lacus <span class="X" id="14">egestas elementum. Curabitur sed diam ipsum.</span>

How can I use JQUERY to find the following:

<span class="X" id="12">consectetur adipiscing elit</span>
<span class="X" id="13">tincidunt quam in facilisis.</span>
<span class="X" id="14">egestas elementum. Curabitur sed diam ipsum.</span>

And send it to the server as follows:

12, consectetur adipiscing
13, tincidunt quam in facilisis.
14, egestas elementum. Curabitur sed diam ipsum.

So ColdFusion can punch results and do 3 insertions into the database?

Answer 1

var postText = "";
$("span.X").each(function() {
     postText += "\n" + $(this).attr("id") + ", " + $(this).text();
});

$.ajax({
   url: "path/to/script",
   type: "POST",
   data: "postText=" + postText,
   success: function(response) {
      // request has finished at this point.
   }
});