Question

I have a following structered DOM result, getting after a POST event:

<root>
  <config>
      // Some inner tree
  </config>
  <test>
    <test testValue="0">
      <id>90</id>
      <time>false</time>
      <config>
        <config1>1</config1>
      </config>
      <languages>
        <language id="en" isDefault="true" >
          <test22 text=""  />
          <test23 text=""  />
        </language>
      </languages>
      <answers>
        <answer>
          <id>201</id>
          <Texts>
            <Text localeId="en" Text="Yes" />
          </Texts>
        </answer>
        <answer>
          <id>202</id>
          <Texts>
            <Text localeId="en"Text="No" />
          </Texts>
        </answer>
      </answers>
    </test>
  </test>
</root>

The above DOM returns after calling $.get(url, function(XML)), and I am able to do these:

Getting the Text (Yes, No), and id (201, 202) with the following code.

    $(XML).find("answer").each(function(){
        var textValue = $(this).find("Text").attr("Text");
        var idValue = $(this).find("id").text();
    });

But I couldn’t find the correct combination to get id (90) e.g. following didn’t work:

$(XML).find("test").children().attr("id");

It’s quite frustrating to debug jquery. I installed Firefox addon, Firequery, and saved the DOM into a file with html extension, but Firequery didn’t allow me to chain the functions like $.find(“id”).text(); . What is the way to get the id value 90 from DOM with jquery? What are you using to debug the jquery while working with DOM and XML files like in the snippet?

Answer 1

id is not an attribute but an element, so you sould select it like you selected text. To get 90, ask for .text() on the id element.

$(XML).find('test').children('id').text();

See http://jsfiddle.net/Mikey/FjnTS/