Making two jquery scripts work together
<p>I'm a jquery newby and was wondering how I could get these two scripts to "talk" to each other:</p>

<pre><code>&lt;form action="" method="post"&gt;
&lt;fieldset&gt;
&lt;div id="selextender"&gt;&lt;/div&gt;
&lt;p&gt;&lt;a href="#" id="seladd"&gt;Add&lt;/a&gt;&lt;/p&gt;
&lt;/fieldset&gt;
&lt;/form&gt;    

$(function () {
     $('a#seladd').click(function () {
         $('&lt;p&gt;&lt;select name="items[]"&gt;&lt;option value="1"&gt;One&lt;/option&gt;&lt;option value="2"&gt;Two&lt;/option&gt;&lt;option value="3"&gt;Three&lt;/option&gt;&lt;/select&gt;&lt;a href="#" class="remove"&gt;Remove&lt;/a&gt;&lt;/p&gt;').fadeIn("slow").appendTo('#selextender');
         return false;
     });
     $('.remove').live('click', function () {
         $(this).parent().fadeOut(300, function () {
             $(this).empty();
             return false;
         });
     });
 });
</code></pre>

<p>Example: <a href="http://jsfiddle.net/UV6Tw/" rel="nofollow">http://jsfiddle.net/UV6Tw/</a></p>

<p>The above duplicates my select boxes - how do I incorporate the following to dynamically add the select box options and still duplicate the select boxes?</p>

<pre><code> $(document).ready(function () {
     $('select[name="products"]').focus(function () {
         if ($('option', this).length &lt; 2) {
             $.getJSON('products.php?product=' + $(this).attr('value'), outputProducts);
         }
     })
 });

 function outputProducts(response) {
     $('select[name="products"]').html(response.html).attr('selectedIndex', response.index);
     return true;
 }

&lt;form action="#" method="post"&gt;
&lt;select name="products"&gt;
&lt;option selected="selected"&gt;Please select&lt;/option&gt;
&lt;/select&gt;   
&lt;/form&gt;
</code></pre>

<p>Any help would be greatly appreciated, thanks   </p>
