Firebase对象将DOM元素返回到DOM元素的对象

Question

在Firebase项目上进行操作，在该项目中，我获取了有关放入变量的child_changed事件的数据。

receipeList = childSnapshot.child('meals/0').val() 

在控制台中，使用FB中的数据，我得到2个对象。

我的问题是，我怎么能得到这个数据在列表或表格（DOM中的任何简单）？ 反复如下：

for(var key in receipeList) { 
    var val = receipeList[key]; 
    var $currentRecipe = $('#contentRecipe'); 
    $currentRecipe.prepend(
    '<div class="row"><div class="col-md-4" id=' + key + '>' + key + '</div>'   + '<div class="col-md-4">' + val + 
    '</div>' 
    ); 
    $currentRecipe.append(
    '</div>' 
    ); 
    }; 

这将得到关键和值。最好我想只有一次键（如标题/顶层列表）和列出的每个键的相关值。 像：

Product | Supplier | {etc} 
-------------------------- 
Appel | Tree  | ... 

Water | Source | ... 

帮助非常感谢。我很抱歉，如果我错过了显而易见的事实，但我真的已经通过无数次尝试，当然还有问题/答案。

顺便说一句，我不是（也不希望这样做）与PHP合作。我的项目完全使用Firebase数据库上的HTML，CSS和JS构建。目前已经实现了很多项目，包括DataTables.js。只是这是某种程度上我无法获得粘贴的障碍。我非常赞赏，因为我只是认为自己的JS是职业变化。

Answer 1

也许这样？

var receipeList = {key1: "value1", key2: "value2"}; 

for(var k in receipeList){ 
    //dinamically create list if not already exists 
    if($("#"+k).length === 0) 
     $("<ul id='"+k+"'>'"+k+"'</ul>").appendTo("body"); 

    $("<li>"+receipeList[k]+"</li>").appendTo("#"+k); 
} 

simple DEMO 和multiple objects DEMO