How do I dynamically populate html elements with JSON Data with Javascript not jQuery?

Question

I have this following JSON data snippit:

{\"items\": [
 {
   \"title\": \"sample 1\",
   \"author\": \"author 1\"
 },
 {
  \"title\": \"sample 2\",
  \"aut         


        

Answer 1

$(document).ready(function () {
    loadfunctionAjax();
});
var loadfunctionAjax = function () {
    $.ajax({
        type: 'GET',
        url: '/Site/SocialLink',
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (data) {
            var HTML = '';
            for (var i = 0; i < data.length; i++) {
                item = data[i];
                HTML += '
' + item.Name + '
 ';
            }
            $('#footerSocialNav').append(HTML);
        }
    });
}