Jquery wrap function inside div
<p>How do I wrap a function inside a div that doesn't exist?</p>

<p>So far, I've tried .append before and after, but that closes the tag. Also tried .html, and wrap right after the function, no luck.</p>

<pre><code>$("#testing .input").each(function() {
    var s = $(this).find("li .value").text();
    // start wrap
    $("span.rune &gt; span", this).each(function() {
        var e = $(this).text();
        $("#test-output").append('&lt;span class="' +e+ ' Rune"&gt;&lt;/span&gt;');
    });
    // stop wrap
    $("#test-output").append('&lt;span&gt;' +txtToNumber[s]+ '&lt;/span&gt;');
});
</code></pre>

<p>Starting HTML :</p>

<pre><code>&lt;div id="test-output"&gt;&lt;/div&gt;
</code></pre>

<p>Ending HTML : </p>

<pre><code>&lt;div id="test-output"&gt;
    &lt;div class="three"&gt;
        &lt;span class="Z Rune"&gt;&lt;/span&gt;
        &lt;span class="Y Rune"&gt;&lt;/span&gt;
        &lt;span class="X Rune"&gt;&lt;/span&gt;
    &lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>Thanks!</p>
