title: how can i retrieve multilevel data in firebase database --Webapp
body: <p>i'm new to firebase and i'm trying to create a wallpaper app. i want to retrieve the data from database which look like this.
  <a href="https://i.stack.imgur.com/Utcal.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Utcal.jpg" alt="enter image description here"></a></p>
  
  <p>. but it's more than two  levels. i want to show the details of boygroup and girlgroup but not their name. i want to show like this 
  <a href="https://i.stack.imgur.com/fP8pG.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/fP8pG.jpg" alt="enter image description here"></a></p>
  
  <p>i can do what i want if i dont add level boygroup and girlgroup but i need these for a categories.it's three level values and it's confusing me how to retrieve boy group child and same with girl group child in one go.
  this is the code for two level childs.. please help me </p>
  
  <pre><code>var dbCategories = firebase.database().ref("categories");
      dbCategories.on("value",function(categories){`
  
  
          if (categories.exists()) {
              var categorieshtml = "";
  
              categories.forEach( function(category) {
                  // statements
  
                  var newCategory =category.val();
                  console.log(category);
                  categorieshtml += "&lt;tr&gt;";
  
                  //for category name 
                  categorieshtml += "&lt;td&gt;";
                  categorieshtml += category.key;
                  console.log(categorieshtml);
                  categorieshtml += "&lt;/td&gt;";
  
                  //for category Description
  
                  categorieshtml += "&lt;td&gt;";
                  categorieshtml += category.val().desc;
                  console.log(categorieshtml);
  
                  categorieshtml += "&lt;/td&gt;";              
  
                  //for category Thumbnail
  
                  categorieshtml += "&lt;td&gt; &lt;img width='250' height='150' src='";
                  categorieshtml += category.val().thumbnail;
                  categorieshtml += "'/&gt;&lt;/td&gt;";
                  categorieshtml += "&lt;/tr&gt;";
  
              }); 
  
              $("#categories").html(categorieshtml);
          }
  </code></pre>