Javascript append not working json jquery

Asked Nov 21 '16 at 08:32

Active Nov 21 '16 at 08:36

Viewed 31 times

Is anyone able to tell me why the Image isn't getting appended to the div? I just want to generate the image URL in the code with the image URL from the JSON file. I'm stuck.

// JSON
{
    "Country": "Austria",
    "Image": "img-url"
}

var json = (function() {
    var json = null;
    $.ajax({
        'async': false,
        'global': false,
        'url': 'url',
        'dataType': "json",
        'success': function(data) {
            json = data;
        }
    });
    return json;
})();

$(json).each(function() {
    if (this.Country === "Austria") {
        $('#austria').append('<div class="img"><img src="'+ this.Image +'"/></div>');
    }
});

<div id="austria"></div>

edited Nov 21 '16 at 08:36

Rory McCrossan

331,213
40
305
339

asked Nov 21 '16 at 08:32

user3770540

1

you have declared var json twice, try renaming one of them. – Kevin Kloet Nov 21 '16 at 08:34
3

You should remove `asyc: false` and use the callback pattern instead. Also you're putting a function call in to a jQuery object, which is the main source of your problem – Rory McCrossan Nov 21 '16 at 08:35

Javascript append not working json jquery

0 Answers0