How I can convert my json data to html?

I have get

$.getJSON('ajax/ajax-test.php', function( data ) {
    ....
});

json data I am trying view:

{
    "1": {
        "section":"painting",
        "category": {
            "1":"african",
            "2":"modern art"
        }
    },
    "2": {
        "section":"antiques",
        "category": { "3":"ikons" }
    }
}

How I can convert my json data to html to look like:

painting

african

modern art

antiques

ikons

I tried

$.each(data, function(i, section_obj){
 $.each(section_obj, function(section, category_arr){
    content += category_arr+'<br />';
});

and

$.getJSON('ajax/ajax-test.php, function( data ) {
var content = '';
    $.each(data, function(i, section_obj) {
   $.each(section_obj, function(section, section_name) {
    c开发者_Python百科ontent += section_name+'<br />';
            $.each(section_obj.category, function(category, category_arr){
               content += category_arr+'<br />';
            });
   });
  });
  $('#content-test').empty().append(content).css({ 'display':'block' }).show('slow');
});

but it not working!

---

First of all, make sure that you can access data, exmp: alert(data[1].section). if not then use: var data = $.parseJSON(data)

And only then try to use:

$.each(data, function(i, section_obj){
 $.each(section_obj.category, function(section, category_arr){
    content += category_arr+'<br />';
});