populate html table using data from ajax based rest call

populate html table using data from ajax based rest call

Hello,

I am having a AJAX REST call in one of the JS file and have a HTML table, want to populate the HTML table with the data recieved in the get call. I have tried the below code  but its not working. 

JS File

$(document).ready(function(){

$.ajax({
    type: "GET",
    url: "SERVICE URL",
    dataType: "jsonp",
    success: function (data) {
$.each(data,function(d,results){
 // ben is the id of the HTML table
$("#ben tbody").append(
                        "<tr>"
                          +"<td>"+results.Firstname+"</td>"
                          +"<td>"+results.Lastname+"</td>"
                          +"<td>"+results.family+"</td>"
                          +"<td>"+results.payout+"</td>"
 +"<td>"+results.bentrust+"</td>"
                        +"</tr>" )
                    })
}
});

});

OUTPUT OF REST SERVICE - JSON data

{"d":{"results":[{"__metadata":{"uri":"https://XXXX/sap/opu/odata/sap/ZAPB_BEN_SRV/set('Pranay')","type":"ZAPB_BEN_SRV.ben"},
"Firstname":"Pranay","Lastname":"Aitha","family":"","payout":"0","bentrust":""}]}}