title: Javascript nested loop
body: <p>I do not code much in Javascript, but I have the following snippet which IMHO looks horrendous and I have to do this nested iteration quite often in my code. Does anyone have a prettier/easier to read solution?</p>
  
  <pre><code>function addBrowse(data) {
  var list = $('&lt;ul&gt;&lt;/ul&gt;')
  
  for(i = 0; i &lt; data.list.length; i++) {
      var file = list.append('&lt;li class="toLeft"&gt;' + data.list[i].name + '&lt;/li&gt;')
      for(j = 0; j &lt; data.list[i].children.length; j++) {
          var db = file.append('&lt;li&gt;' + data.list[i].children[j].name + '&lt;/li&gt;')
          for(k = 0; k &lt; data.list[i].children[j].children.length; k++)
              db.append('&lt;li class="toRight"&gt;' + data.list[i].children[j].children[k].name + '&lt;/li&gt;')
      }
  }
  
  $('#browse').append(list).show()}
  </code></pre>
  
  <p>Here is a sample data element</p>
  
  <pre><code>{"file":"","db":"","tbl":"","page":"browse","list":[
    {
       "name":"/home/alex/GoSource/test1.txt",
       "children":[
          {
             "name":"go",
             "children":[
                {
                   "name":"validation1",
                   "children":[
  
                   ]
                }
             ]
          }
       ]
    },
    {
       "name":"/home/alex/GoSource/test2.txt",
       "children":[
          {
             "name":"go",
             "children":[
                {
                   "name":"validation2",
                   "children":[
  
                   ]
                }
             ]
          }
       ]
    },
    {
       "name":"/home/alex/GoSource/test3.txt",
       "children":[
          {
             "name":"go",
             "children":[
                {
                   "name":"validation3",
                   "children":[
  
                   ]
                }
             ]
          }
       ]
    }]}
  </code></pre>
  
  <p>Thanks a lot</p>