Beginner struggling with JQuery .change tag
<p>Knowing HTML well, I'm trying to learn JQuery.  I found the .change function on a <a href="http://api.jquery.com/change/" rel="nofollow">JQuery site</a> that does exactly what I want. </p>

<p>Ideally I'd like test1 and test2 to only affect each other and test3 and test4 only each other and so on.</p>

<p>Right now test2 and test4 affect both test1 and test3</p>

<p>Here is my code:</p>

<pre><code>&lt;select id="test1" name="sweets" multiple="multiple"&gt;
&lt;option&gt;Chocolate&lt;/option&gt;
&lt;option selected="selected"&gt;Candy&lt;/option&gt;
&lt;option&gt;Taffy&lt;/option&gt;
&lt;option selected="selected"&gt;Caramel&lt;/option&gt;
&lt;option&gt;Fudge&lt;/option&gt;
&lt;option&gt;Cookie&lt;/option&gt;
&lt;/select&gt;

&lt;div id="test2"&gt;&lt;/div&gt;

 &lt;script&gt;
    $("select#test1").change(function () {
    var str = "";
    $("select option:selected").each(function () {
        str += $(this).text() + " ";
     });
      $("div#test2").text(str);
     })
   .change();
&lt;/script&gt;


&lt;select id="test3" name="sweets" multiple="multiple"&gt;
&lt;option&gt;Chocolate&lt;/option&gt;
&lt;option selected="selected"&gt;Candy&lt;/option&gt;
&lt;option&gt;Taffy&lt;/option&gt;
&lt;option selected="selected"&gt;Caramel&lt;/option&gt;
&lt;option&gt;Fudge&lt;/option&gt;
&lt;option&gt;Cookie&lt;/option&gt;
&lt;/select&gt;

&lt;div id="test4"&gt;&lt;/div&gt;

&lt;script&gt;
    $("select#test3").change(function () {
    var str = "";
    $("select option:selected").each(function () {
        str += $(this).text() + " ";
     });
      $("div#test4").text(str);
     })
   .change();
&lt;/script&gt;
</code></pre>

<p>I tried separating it with ID's, but it's not quite there yet. 
How would I get this to work right?</p>
