Question

I’d like to take the items from this object:

var things = {
    "thing1" : "I'm one",
    "thing2" : "I'm two",
    "thing3" : "I'm three",
}

And append them into this markup:

<div class="allthings">
<div class="thing1">other content first. </div>
<div class="thing2">other content first. </div>
<div class="thing3">other content first. </div>   
</div>

resulting in:

<div class="thing1">other content first. <p class="added">I'm one</p></div>
... etc.

I’m no good at .each() loops. What’s the jQuery equivalent of:

“For each item in the object, find the div with the class matching the item’s key and append the item’s value as a paragraph with the class ‘added’.”

Answer 1

This will work:

$.each(things, function(key, value) {
    $("<p />").addClass("added").text(value).appendTo("." + key);
});

DEMO: http://jsfiddle.net/exEbw/

---

UPDATE. For IDs use hash # character instead of dot . in appendTo selector:

$("<p />").addClass("added").text(value).appendTo("#" + key);

DEMO: http://jsfiddle.net/exEbw/1/