Changing CSS in dynamically generated HTML - html

Question

How can I get access and change CSS like the font color in completely dynamically generated HTML out of XML, if I cannot use an ID as I do not know in advance how many of the same HTML-tags will be generated and which of two different (red/green) colors it will need? (I am new here and very new in JS)
Data will be generated and collected on the server. I get them back and sort them in a "fieldset" and further more in a "collapsible". Data "var a, b and c" come together in one line (fieldset) and should be in a specific font color. So for "var d" there will be a "xx" or "yy" coming back from XML for this font color and be saved in "var d" and therefore the font color should be "red" or "green".
Part of my script in short:
function addPart(currentIndex,currentPart)
{
var a = $(currentPart).find("a").text();
var b = $(currentPart).find("b").text();
var c = $(currentPart).find("c").text();
var d = $(currentPart).find("d").text();
if(d === "xx") {
$("div.productColor").css({"color":"green"});
} else {
$("div.productColor").css({"color":"red"});
};
$("#shoppingTableDiv").append (
"<div data-role='collapsible'>"
+ "<h3>"
+ "<div class='productColor'>"
+ "<fieldset class='ui-grid-b'>"
+ "<div class='ui-block-a'>"
+ a
+ "</div>"
+ "<div class='ui-block-b'>"
+ b
+ "</div>"
+ "<div class='ui-block-c'>"
+ c
+ "</div>"
+ "</fieldset>"
+ "</div>"
+ "</h3>"
+ "</div>");
$('#shoppingTableDiv').collapsibleset('refresh');
}

Answer 1

I didn't fully understand how you want to color your results, but I think you can use your fieldset classes.
For example:
.ui-grid-b div { color: red; }
.ui-grid-c div { color: green; }
If you don't know how many fieldsets you're going to have and you can't use the fieldset classes you showed in your code example, you might find the nth-child selector useful.
Maybe something like this:
fieldset:nth-child(2n) div { color: red; }
fieldset:nth-child(2n+1) div { color: green; }