I am receiving a JSON object, inserting this info into a template and then appending this to a DIV. One of the elements that I'm inserting has the id set to device_id.
Once my template html has been inserted I want to select the DIV which has the ID=device_id and insert some further information into it.
I'm assuming the reason why this doesn't currently work is because the DOM hasn't yet updated by the time i'm attempting to select the div with the device_id, but I don't know how to deal with this.
var obj = $.parseJSON(msg);
$("#myTemplate").tmpl(obj).appendTo("#message");
jQuery.each(obj, function () {
$('#' + this.device_id).append('<p>Hello</p>');
});
The above code is inside a click event. And the DOM will look like this:
<div id="message">
<div class="item">
<div id="#156846"></div>
<div id="name"></div>
</div>
</div>
The JSON being received (msg) looks like this:
[{"name":"Person A","device_type":"one", "device_id":"156846"}]
How do I insert the 'Hello' into the div where id=this.device_id?