Question

I have a page where a plugin adds child div’s to a parent div at random time interval.
The basic structure is :

<div id="parent">
<div class="child" someattr="abc">content1</div>
<div class="child" someattr="xyz">content2</div>
</div>

I tried the following to detect adding of elements and it works

var c = document.getElementById('parent');
c.__appendChild = c.appendChild;
c.appendChild = function(){
     alert("Added");
     c.__appendChild.apply(c, arguments);     
}

I got the above from an answer in stackoverflow itself.
What I would also like to do is to get the contents of the child divs.
That is, their attributes and the content inside.
What would be the easiest/best way to go on this.
I wouldn’t mind if the solution is jquery

Answer 1

No jQuery needed:

document.getElementById('parent').innerHTML;

Of course you could use jQuery as well, because it might help you get the individual children:

$('#parent .child').each(
    function(){ 
         // In this context, 'this' points to the current child element in the itertion
    }