how to add content to dynamicly crated tab with jquery
<p>i wanted to ask how can i attach content to dymamicly created tab ?
if i leave a div with that id there is a mess.</p>

<ol>
<li>the third tab content apper in the first tab</li>
<li>after i click the checkbox it's looks good but in the third click
(hide and show again) the third tab content dissaper.</li>
</ol>

<p>how can i press the checkbox to show and hide the tab and and his content dynamicly.</p>

<p>live : <a href="http://jsfiddle.net/dSxby/" rel="nofollow">http://jsfiddle.net/dSxby/</a></p>

<p>html:</p>

<pre><code>&lt;div id="tabs"&gt;
    &lt;ul&gt;
        &lt;li&gt;&lt;a href="#tabs-1"&gt;tab 1&lt;/a&gt;
        &lt;/li&gt;
        &lt;li&gt;&lt;a href="#tabs-2"&gt;tab 2&lt;/a&gt;
        &lt;/li&gt;
    &lt;/ul&gt;
    &lt;div id="tabs-1"&gt;
        &lt;table class="form-table"&gt;
            &lt;tr&gt;
                &lt;th scope="row"&gt;
                    &lt;label for="dp_add_license"&gt;Add tab&lt;/label&gt;
                &lt;/th&gt;
                &lt;td&gt;
                    &lt;input type="checkbox" id="dp_add_license" name="dp_add_license" value="1"
                    /&gt;
                &lt;/td&gt;
            &lt;/tr&gt;
        &lt;/table&gt;
    &lt;/div&gt;
    &lt;div id="tabs-2"&gt;
        &lt;p&gt;tab  2 content.&lt;/p&gt;
    &lt;/div&gt;
    &lt;div id="tabs-3"&gt;
        &lt;p&gt;tab 3 content.&lt;/p&gt;
    &lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>jquery:</p>

<pre><code> $(document).ready(function() {
    $("#tabs").tabs();
      $('#dp_add_license').click(function() {
          if ($(this).is(':checked')) {
              $("#tabs").tabs("add", '#tabs-3', "tab 3");
          } else {
              $("#tabs").tabs("remove", '#tabs-3');
          }
      });
});
</code></pre>

<p>thanks</p>
