how to get jquery object, then manipulate the dom elements inside it
<p>Ok I know jquery can do this pretty simply, but digging around I'm a bit confused whether I should be using replaceWith, filters, html, text, clone etc!</p>

<p>Here's what I'm doing.  I'm using jquery UI tabs and whenever I create a new tab I need to use the html from another place on the dom but slightly modify it before I use it for the new tab.  So it looks like this:</p>

<pre><code>_$chatTabs = $("#dvChatManager").tabs({
    selected: 0,
    tabTemplate: "&lt;li&gt;&lt;a href='#{href}'&gt;#{label}&lt;/a&gt; &lt;span style=\"position:absolute;right:0px;\" class='ui-icon ui-icon-close'&gt;Remove Tab&lt;/span&gt;&lt;/li&gt;",
    add: function (event, ui){
        var html = $('.dvChatBoxWrapper', $('#dvChat-' + _activeGID)).clone();
        $(ui.panel).append(html);
        initTabs();
    }
});
</code></pre>

<p>So in the "add" part, you can see that I clone another div and append it to the panel.  But before I append it to the panel, I need to clear out some divs within variable html and possibly change other html things.  I'm a bit confused about the best approach.  Also I'm open to another approach of using other divs on the dom as templates!</p>
