Jquery to change value of “value” attribute in xml element

Question

Example (snippet) :

 <FIELD name="xxxxxxxx" refname="xxxx" type="String" reportable="dimension">
  <WHEN field="xxxxxxxx" value="xxxxxxxxxxxxxxxxx">
    <ALLOWEXISTINGVALUE />
    <ALLOWEDVALUES expanditems="true">
      <LISTITEM value="n.a." />
      <LISTITEM value="Test" />
    </ALLOWEDVALUES>
  </WHEN>
  <WHEN field="yyyyyyyyyyyyy" value="yyyyyyy">
    <ALLOWEXISTINGVALUE />
    <ALLOWEDVALUES expanditems="true">
      <LISTITEM value="n.a." />
    </ALLOWEDVALUES>
  </WHEN>
</FIELD>

When I do:

 var $listItem = $(xmlDoc).find("FIELD[name='" + dependentFieldType + "'] > WHEN[value='" + productName + "'] ALLOWEDVALUES > LISTITEM[value='" + listItem + "']");
 $listItem.val(newListItemValue);

It does not update the listitem value

Also tried .prop("value") and .attr("value") on $listItem.

Would be very thankful for a working jsfiddle with the above xml sample, which edits the value attribute of LISTITEM

Answer 1

Every time you call $(xml) you are creating a new DOM object based on the original string. Try this instead:

j = $(xml);
j.find('attr').attr('foo', 'bar');
console.log(j.html());

Now you parse the XML string only once and update the resulting node.