fetch data by web api

<script type="text/javascript">

jQuery(document).ready(function(){


$.ajaxSetup({
 headers: {
  'X-Api-Key': '79rytghfvtyfvhbs09oe',
  'X-Store-Id': 38,
 },
}),
$.ajax({
 type: "POST",
 url: "https://webapi.app2food.com/v1/getBlogPost",
 dataType: 'json',
 data : {store_id: 38},
 success:function(responce){
 console.log(responce);



  }

 
 });

});

</script>

Get Data for Json Api By Jquery

jQuery(document).ready(function(){
$.ajaxSetup({
headers: {
'X-Api-Key': 'dhada78dshdks',
'X-Store-Id': 1024,
},
}),
$.ajax({
type: "POST",
url: "https://www.app2mobile.com/ci_app2dine/api_web/getCategoriesAndProduct",
dataType: 'json',
data : {store_id: 1024},
success:function(responce){
console.log(responce.data);
var catandpros = responce.data;
var arr = $.map(catandpros, function(el) { return el; })
console.log(arr);
var section = 1;
var menu_div = '';
arr.forEach(function(entry){
menu_div += entry['category_name'];
menu_div += '<br>';
});
  jQuery('#output').html(menu_div);
  }
 });
});

</script>

Fetch Data from Json by jquery

<script type="text/javascript">
jQuery(document).ready(function(){

 $.ajax({
  type: "POST",
  url: "product.json",
  dataType: 'json',
  success:function(responce){
   console.log(responce.data);
   var catandpros = responce.data;
   var arr = $.map(catandpros, function(el) { return el; })
   console.log(arr);
   var section = 1;
   var menu_div = '';
   arr.forEach(function(entry){
    menu_div += entry['category_name'];
    menu_div += '<br>';
  });
  jQuery('#output').html(menu_div);
  }
 });
});

</script>

json fetch into table

<table id="personDataTable">
    <tr>
        <th>Id</th>
        <th>First Name</th>
        <th>Last Name</th>
    </tr>
   
</table>

// ignore this first line (its fidle mock) and it will return what ever you pass as json:... parameter... consider to change it to your ajax call
$.ajax({
    url: '/echo/json/',
    type: "post",
    dataType: "json",
    data: {
        json: JSON.stringify([
            {
            id: 1,
            firstName: "Peter",
            lastName: "Jhons"},
        {
            id: 2,
            firstName: "David",
            lastName: "Bowie"}
        ]),
        delay: 3
    },
    success: function(data, textStatus, jqXHR) {
        // since we are using jQuery, you don't need to parse response
        drawTable(data);
    }
});

function drawTable(data) {
    for (var i = 0; i < data.length; i++) {
        drawRow(data[i]);
    }
}

function drawRow(rowData) {
    var row = $("<tr />")
    $("#personDataTable").append(row); //this will append tr element to table... keep its reference for a while since we will add cels into it
    row.append($("<td>" + rowData.id + "</td>"));
    row.append($("<td>" + rowData.firstName + "</td>"));
    row.append($("<td>" + rowData.lastName + "</td>"));
}

css

table {

  border: 1px solid #666;   

    width: 100%;

}

th {

  background: #f8f8f8; 

  font-weight: bold;    

    padding: 2px;

}

out put

Id	First Name	Last Name
1	Peter	Jhons
2	David	Bowie

http://jsfiddle.net/mjaric/sewm6/