title: JQuery not returning select box values if no element is selected
body: <p>Not sure whats going on here, I must be missing something. I have two select boxes and users can move elements between them to select which data elements they would like to download, here is the screen grab:<img src="https://i.stack.imgur.com/rB3Jl.png" alt="Everything is groovy"></p>
  
  <p>Everything works great EXCEPT when the user moves some elements back to the "Data Concepts" box leaving no elements in the "Selected Data" selected, as seen here:
  <img src="https://i.stack.imgur.com/72NgC.png" alt="Not cool"></p>
  
  <p>Here is the code that is grabbing the values from the "Selected Data" box:</p>
  
  <pre><code>var ExportSel = [];
  
  $('#DataList2').each(function(){
  ExportSel = $('#DataList2').val();
  });
  </code></pre>
  
  <p>But this returns an empty array if nothing is selected regardless of the number of elements in the "Selected Data" box. Although when I inspect it in firebug, it shows the elements and values are present in the selector box. </p>
  
  <p>Am I misunderstanding the .each function, the .val function or something even more fundamental?</p>
  
  <p>A huge thanks in advance, always impressed with the stack community! </p>