jQuery iterating through a html "blob" / document - unable to access properties
<p><strong>Premise:</strong></p>

<p>I want to take a chunk of html off of a document, and then change the div id's and reprint the same html chunk with some modifications, in the same document, below the original html. I would repeat this 'X' times.</p>

<p><strong>Problem:</strong></p>

<p>I can't seem to access the divs in the html chunks when I'm trying to reprint.</p>

<p><strong>My steps</strong></p>

<ul>
<li><p>I have some html on a page, enclosed in a div,</p>

<pre><code>&lt;div id="a"&gt;
   &lt;div id="aaa"&gt;...&lt;/div&gt;
   &lt;div id="bbb"&gt;...&lt;/div&gt;
   &lt;div id="ccc"&gt;...&lt;/div&gt;
&lt;/div&gt;
</code></pre></li>
</ul>

<p>I extract this html using jQuery</p>

<pre><code>var h = $("#a").html();
</code></pre>

<p>I convert it to a jQuery object</p>

<pre><code>var jqObj = $(h);
</code></pre>

<p>And then look through the div's in it</p>

<pre><code>$("div", jqObj).each(function (idx, elem) {
       //elem is a HTMLDivElement type
        var jq = $(this);
       // I want to access the id, class etc. of the div elements here            
    });
</code></pre>

<p>The 'each' iterates correctly as many times as there are divs.</p>

<p>But no matter what I do, whether $(this).attr("id") or elem.id or whatever else, it all returns as undefined. I printed the $(this).html() and it seems to have the content, but all the id's from the div seem to be stripped out.</p>

<p>What am I doing wrong? How do I get hold of the id's (I need to change them before printing out the html again) and other properties of this HtmlDivElement?</p>

<p><strong>Problem solved</strong></p>

<p>See comment below on using clone(). Here's my function in case someone else needs it.</p>

<pre><code>function Inserts() {
    //get the html    
    var h = $("#a").clone();

    //now turn it into a jquery object
    var jqObj = $(h);

    //now parse it, let's make some modifications
    var someID = "0";
    $("div", jqObj).each(function (idx, elem) {

        if ($(this).attr("id") == undefined)
            return;

        $(this).attr("id", someID + "_" + $(this).attr("id"));
    });

    $("#target_div").append(jqObj.html());
</code></pre>

<p>}</p>
