Rebekah Rebekah - 13 days ago 7
jQuery Question

jQuery with json displaying in a list

How do I display json data in a list using jQuery?



$(document).ready(function() {


$.getJSON('example.json', function(data) {

$.each(data.example, function(key, value) {

var output="";
output="<li>" + data.example[key].name + "</li>";

$('#example').append(output);

});

});
}





This doesn't seem to display anything.

Answer
$(document).ready(function() {
    $.getJSON('example.json', function(data) {
        var output = '';
        $.each(data.example, function(key, value) {
            output += '<li>' + value.name + '</li>';
        });
        $('#example').html(output); // <ul id="example"></ul>
    });
});

UPDATE: Working JSON file

{
    "example": [
        {
          "name": "Dr. Sammie Boyer",
          "email": "Lavonne.Kiehn@hotmail.com"
        },
        {
          "name": "Eladio Beier",
          "email": "Lavonne.Kiehn@hotmail.com"
        },
        {
          "name": "Hilton Borer",
          "email": "Reva.Goyette@yahoo.com"
        }
    ]
}