title: AlpineJS loop inside loop to add table row
body: <p>I need help to solve this problem, i know AlpineJs must use something for &quot;fragments&quot;, its fine when i workin on div, but when i do loop table row, and have another row, it become a problem, because i cant use div for the fragment. is there any solution?</p>
  <p>here's my code</p>
  <pre><code>&lt;template x-for=&quot;data in data&quot;&gt;
      &lt;tr&gt;
          &lt;td&gt;
              &lt;div class=&quot;d-flex justify-content-between&quot;&gt;
                  &lt;i class=&quot;fa fa-lock&quot;&gt;&lt;/i&gt;
                  &lt;i class=&quot;fa fa-caret-up&quot;&gt;&lt;/i&gt;
              &lt;/div&gt;
          &lt;/td&gt;
          &lt;td&gt;100&lt;/td&gt;
          &lt;td&gt;&lt;a href=&quot;#&quot;&gt;Akun 1&lt;/a&gt;&lt;/td&gt;
          &lt;td&gt;Kategori Akun A&lt;/td&gt;
          &lt;td class=&quot;text-end&quot;&gt;Rp 0,00&lt;/td&gt;
      &lt;/tr&gt;
  
      &lt;template x-for=&quot;data2 in data.children&quot;&gt;
          &lt;tr&gt;
              &lt;td&gt;
                  &lt;div class=&quot;d-flex justify-content-between&quot;&gt;
                      &lt;i class=&quot;fa fa-lock&quot;&gt;&lt;/i&gt;
                      &lt;i class=&quot;fa fa-caret-up&quot;&gt;&lt;/i&gt;
                  &lt;/div&gt;
              &lt;/td&gt;
              &lt;td&gt;100&lt;/td&gt;
              &lt;td&gt;&lt;a href=&quot;#&quot;&gt;Akun 1&lt;/a&gt;&lt;/td&gt;
              &lt;td&gt;Kategori Akun A&lt;/td&gt;
              &lt;td class=&quot;text-end&quot;&gt;Rp 0,00&lt;/td&gt;
          &lt;/tr&gt;
  
          &lt;template x-for=&quot;data3 in data2.children&quot;&gt;
              &lt;tr&gt;
                  &lt;td&gt;
                      &lt;div class=&quot;d-flex justify-content-between&quot;&gt;
                          &lt;i class=&quot;fa fa-lock&quot;&gt;&lt;/i&gt;
                          &lt;i class=&quot;fa fa-caret-up&quot;&gt;&lt;/i&gt;
                      &lt;/div&gt;
                  &lt;/td&gt;
                  &lt;td&gt;100&lt;/td&gt;
                  &lt;td&gt;&lt;a href=&quot;#&quot;&gt;Akun 1&lt;/a&gt;&lt;/td&gt;
                  &lt;td&gt;Kategori Akun A&lt;/td&gt;
                  &lt;td class=&quot;text-end&quot;&gt;Rp 0,00&lt;/td&gt;
              &lt;/tr&gt;
          &lt;/template&gt;
      &lt;/template&gt;
  &lt;/template&gt;
  </code></pre>