title: How do we populate a dropdown list's element from a variable in a collection in Meteor?
body: <p>I am actually trying to do 2 things here:  </p>
  
  <p>With 2 dropdown lists,<br>
   a) the first would populate with the products, while<br>
   b) the second would populate with the colors according to the first dropdown selected.</p>
  
  <p>I starts off insert a document into the collection as below:  </p>
  
  <pre><code>ProductList.insert ({ product: "apple", color: "\"red\",\"green\""});  
  ProductList.insert ({ product: "banana", color: "\"yellow\",\"green\""});
  </code></pre>
  
  <p>And this is what I have so far:  </p>
  
  <p><strong>Main.html</strong>  </p>
  
  <pre><code>&lt;template name="prodlist"&gt;
  &lt;select id="category-select"&gt;
          &lt;option disabled="disabled" selected="selected"&gt;Please Select&lt;/option&gt; 
          {{#each prodlist}}
              &lt;option value="{{this}}"&gt;{{this}}&lt;/option&gt;
          {{/each}}
      &lt;/select&gt;
  &lt;/template&gt;
  
  &lt;template name="colorlist"&gt;
  &lt;select id="category-select"&gt;
          &lt;option disabled="disabled" selected="selected"&gt;Please Select&lt;/option&gt; 
          {{#each colorlist}}
              &lt;option value="{{this}}"&gt;{{this}}&lt;/option&gt;
          {{/each}}
      &lt;/select&gt;
  &lt;/template&gt;  
  </code></pre>
  
  <p><strong>Main.js</strong>  </p>
  
  <pre><code>Template.prodlist.helpers({
      prodlist: function(){
          return ProductList.find().map(function(doc) {
              return doc.product
          })
      }
  });  
  
  Template.colorlist.helpers({
  colorlist: function(){
      return ProductList.find().map(function(doc) {
          return doc.color.split(",")  //&lt;-- edited with MrE's answer
      })
  </code></pre>
  
  <p>The reason I insert <code>color: "\"red\",\"green\""</code> is trying to simulate when you populate the dropdown as hardcode:  <code>return ["red", "green"]</code>, but it return as one element with the string <code>"red","green"</code>.  Is there a better approach?  Also I don't know if there are packages exists that handle dropdown.  Thanks in advance. </p>