title: How to properly append json result to a select option
body: <p>How to properly append json result to a select option,</p>
  
  <p>sample json data</p>
  
  <p><img src="https://i.stack.imgur.com/TYRQg.png" alt="enter image description here"></p>
  
  <p>Ajax code:</p>
  
  <pre><code>$.ajax({
          url: 'sessions.php',
          type: 'post',
          datatype: 'json',
          data: { from: $('#datepicker_from').val().trim(), to: $('#datepicker_to').val().trim() },
          sucess: function(data){
              var toAppend = '';
              //if(typeof data === 'object'){
                  for(var i=0;i&lt;data.length;i++){
                      toAppend += '&lt;option&gt;'+data[i]['id']+'&lt;/option&gt;';
                  }
              //}
              $('#sessions').append(toAppend);
          }
      });
  </code></pre>
  
  <p>html code:</p>
  
  <pre><code>&lt;p&gt;Sessions: 
  &lt;select id="sessions"&gt;&lt;/select&gt;
  </code></pre>
  
  <p></p></p>
  
  <p>I already set to my php file</p>
  
  <pre><code>header("Content-Type: application/json");
  </code></pre>