title: Populate a dropdown using jQuery
body: <p>I am trying to populate a drop down using with the following JSON data:</p>
  <pre><code>[
    {
      &quot;id&quot;: &quot;1&quot;,
      &quot;name&quot;: &quot;Unknown&quot;
    },
    {
      &quot;id&quot;: &quot;2&quot;,
      &quot;name&quot;: &quot;Chrome&quot;
    },
    {
      &quot;id&quot;: &quot;3&quot;,
      &quot;name&quot;: &quot;Firefox&quot;
    },
    {
      &quot;id&quot;: &quot;4&quot;,
      &quot;name&quot;: &quot;Internet Explorer&quot;
    },
    {
      &quot;id&quot;: &quot;5&quot;,
      &quot;name&quot;: &quot;Edge&quot;
    },
    {
      &quot;id&quot;: &quot;6&quot;,
      &quot;name&quot;: &quot;Safari&quot;
    },
    {
      &quot;id&quot;: &quot;7&quot;,
      &quot;name&quot;: &quot;Mobile Chrome&quot;
    },
    {
      &quot;id&quot;: &quot;8&quot;,
      &quot;name&quot;: &quot;Mobile Safari&quot;
    },
    {
      &quot;id&quot;: &quot;9&quot;,
      &quot;name&quot;: &quot;Opera&quot;
    }
  ]
  </code></pre>
  <p>Here is my code:</p>
  <pre><code>$(document).ready(function () {
    $.getJSON(&quot;http://www.randyconnolly.com/funwebdev/services/visits/browsers.php&quot;, function(results){
        var $el = $(&quot;#filterBrowser&quot;);
        $el.empty(); // remove old options
        $el.append($(&quot;&lt;option&gt;&lt;/option&gt;&quot;)
        .attr(&quot;value&quot;, '').text('Please Select'));
        
        $.each(results, function (index, value) {
            $el.append($(&quot;&lt;option&gt;&lt;/option&gt;&quot;)
            .attr(&quot;value&quot;, value).text(value));
  
          });
      });
  });
  </code></pre>
  <p>The dropdown is being populated incorrectly, and it's returning</p>
  <blockquote>
  <p>[object Object]</p>
  </blockquote>
  <p>rather than &quot;Unknown,Chrome,Firefox,Internet Explorer, and so on.</p>