title: how to append option to a select
body: <p>I have a variable which contains a number. I'd like to append an option with the numeric value in each based on whatever the variable number is ( ie: if total equals 10, then I need to add 10 options to the select with each option containing the next numeric row value, so 1, 2, 3, 4...etc. I start off with one hard coded option, and then I need to add options dynamically for every case. I've tried a multitude of scripts but I"m getting " cannot use in operator to search for length.</p>
  
  <p><a href="https://jsfiddle.net/v1yyhfm8/" rel="nofollow noreferrer">https://jsfiddle.net/v1yyhfm8/</a> </p>
  
  <p>HTML</p>
  
  <pre><code> &lt;select id="main"&gt;
       &lt;option selected&gt;1&lt;/option&gt;
   &lt;/select&gt;
  </code></pre>
  
  <p>I tried:</p>
  
  <pre><code> var total = dataSource.total();
   for (var i = 1; 1 &lt;= total; i++) {
       var added = document.createElement('option');
       var test = $('#main');
       added.value = i;
       added.innerHTML = i;
       test.append(added);
   }
  </code></pre>
  
  <p>and</p>
  
  <pre><code>  var total = dataSource.total();
    $.each(total, function (i, item) {
      $('#main').append($('&lt;option&gt;', {
         value: item.total,
         text: item.text
      }));                               
    });
  </code></pre>