title: Use JQuery to set the select option value and text from Array
body: <p>I have a <code>select</code> box that I am getting <code>multiple</code> values from and storing them in an <code>Array</code>using <code>JQuery</code>. </p>
  
  <p>I would like to know how I can then use the contents of this <code>Array</code> to populate <code>options</code> in another select box. </p>
  
  <p>So currently I've got this:</p>
  
  <pre><code> $('#addBtn').click(function(e){
          e.preventDefault();
          //Get the selected Items in the dropdown 1
          var selected = new Array();
          $('#compresult option:selected').each(function(){
              selected.push($(this).val() + " " + $(this).text());//Add to Array
          });
  
          //Update contents of dropdown 2  with the Array 
       });
  </code></pre>
  
  <p>My <code>HTML</code> for dropdown is :</p>
  
  <pre><code>&lt;select multiple="multiple" name="contributors[]" id="compresult"&gt;
      &lt;option value="0"&gt;&lt;/option&gt;
      &lt;option value="3610"&gt;X&lt;/option&gt;
      &lt;option value="3605"&gt;Y&lt;/option&gt;
      &lt;option value="335"&gt;Z&lt;/option&gt;
   &lt;/select&gt;
  </code></pre>
  
  <p>If I select option X and Y my <code>selected</code> array in my <code>JS</code> Code outputs this:</p>
  
  <pre><code>Array [ "3610 X", "3605 Y" ]
  </code></pre>
  
  <p>How can I then use these values to populate another dropdown? i'm trying to implement an ADD/REMOVE from list functionality type thing.</p>
  
  <p>EDIT: EXPECTED OUTPUT OF DROPDOWN 2</p>
  
  <pre><code>&lt;select multiple="multiple" name="dropdown2" id="compresult"&gt;
          &lt;option value="3610"&gt;X&lt;/option&gt;
          &lt;option value="3605"&gt;Y&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>