Question

I have the following that produces a drop down using a JSON file:

<script type="text/javascript">
  $.getJSON('shares.json', function(data) {
  var items = [];

  $.each(data.Destinations, function(key, val) {
  items.push('<option id="' + val.shareName + '">' + val.shareName+ '</option>');
  });

  $('<select/>', {
    'class': 'my-new-list',
    html: items.join('')
  }).appendTo('body');
});
</script>

I can’t position this drop down as I would usually, how can I tell it to go to a div for example? I suppose the appendTo(‘body’) is simply adding it to the end of my HTML but how do you change it?

Thanks!

Answer 1

try this

  $('<select/>', {
    'class': 'my-new-list',
    html: items.join('')
  }).appendTo('#myDiv');

You don’t have to append to body…you can append to any element which can hold the specified elements.