javascript - I'm unable to find a result in my div -

i'm not getting result in div

here jquery

$('#btnsearchres').click(function(){                 var $server;                 var content;                 $server = 'http://localhost/xdk/';    $.getjson("http://localhost/xdk/timeline.php",function(data){        $.each(data.recipes, function(i,post){         content = '<p>' + post.i_name + '</p>';         content += '<p>' + post.i_recipe + '</p>';         content += '<img src="http://localhost/xdk/'+post.image_thumb+'"/>';         content += '<br/>';        });        $(content).appendto("#recipes");     }); 

json

{     "i_id": "1",     "i_name": "biryani",     "i_category": "pakistani",     "i_uploader_name": "nabeel",     "i_recipe": "2 cups basmati- rice \r\n3\/4kg chicken pieces \r\nonion 3 large, sliced \r\n1 cup yoghurt \r\n1 tsp ginger paste \r\n1\/2 tsp garlic paste \r\n1 tsp green chilli paste \r\n1\/2 cup tomato puree \r\n2 tsp red chilli powder \r\n1 tsp turmeric powder \r\n1 tsp cumin powder (roasted) \r\n1\/2 tsp cardamom powder \r\n2 tsp garam masala powder \r\n1\/2 cup milk \r\na pinch saffron \r\n1 tsp coriander powder \r\ngreen coriander leaves 2 tbsp, chopped \r\nwater 3 1\/2 cups \r\n7 tbsp oil \r\nsalt required\r\n\r\nmethod :\r\n1. make mixture t",     "i_tags": "",     "i_ingredients": "chicken rice ginger garlic garam-masala green-chilli-paste turmeric-powder safron",     "i_dateofadd": "2016-01-24",     "i_rate": "0",     "image_name": "biryani-main1.jpg",     "image_path": "images\/biryani-main1.jpg",     "image_thumb": "thumb\/biryani-main1.jpg" } 

and i've div called recipes in html

 <input id="btnsearchres" type="button" class="btn btn-danger" value="search"/>             <input id="btnaddrec" type="button" class="btn btn-danger" value="add recipe"/>   </div>         <div id="recipes">   </div> 

i couldnt of results

i want result seen on html file when btnsearch button pressed not showing thing

well code should work , assume json code should this:

{   "recipes" : [      {        "i_id": "1",        "i_name": "biryani",        "i_category": "pakistani",        "i_uploader_name": "nabeel",        "i_recipe": "2 cups basmati- rice \r\n3\/4kg chicken pieces \r\nonion 3 large, sliced \r\n1 cup yoghurt \r\n1 tsp ginger paste \r\n1\/2 tsp garlic paste \r\n1 tsp green chilli paste \r\n1\/2 cup tomato puree \r\n2 tsp red chilli powder \r\n1 tsp turmeric powder \r\n1 tsp cumin powder (roasted) \r\n1\/2 tsp cardamom powder \r\n2 tsp garam masala powder \r\n1\/2 cup milk \r\na pinch saffron \r\n1 tsp coriander powder \r\ngreen coriander leaves 2 tbsp, chopped \r\nwater 3 1\/2 cups \r\n7 tbsp oil \r\nsalt required\r\n\r\nmethod :\r\n1. make mixture t",        "i_tags": "",        "i_ingredients": "chicken rice ginger garlic garam-masala green-chilli-paste turmeric-powder safron",        "i_dateofadd": "2016-01-24",        "i_rate": "0",        "image_name": "biryani-main1.jpg",        "image_path": "images\/biryani-main1.jpg",        "image_thumb": "thumb\/biryani-main1.jpg"     }   ] } 

but if data returned single object in array, in format have given in question, might want change data.recipes data , check if works.

update:

according comment on timeline.php does, think returns 1 result. might want change javascript this:

$('#btnsearchres').click(function(){                 var $server;                 var content;                 $server = 'http://localhost/xdk/';    $.getjson("http://localhost/xdk/timeline.php",function(data){         content = '<p>' + data.i_name + '</p>';         content += '<p>' + data.i_recipe + '</p>';         content += '<img src="http://localhost/xdk/'+data.image_thumb+'"/>';         content += '<br/>';         $(content).appendto("#recipes");     }); });