How to create html structure which will allow only 3 div elements in each li. In React + underscore.js
<p>For creating this structure i want to use only underscore.js methods.
I have below array .</p>

<pre><code> var xyz = [{
    'name': 'test'
 },{
    'name': 'test1'
 },{        
    'name': 'test2'
 },{ 
    'name': 'test3'
 },{ 
    'name': 'test4'
 },{
    'name': 'test5'
</code></pre>

<p>}];</p>

<p>And HTML structure should create like this - </p>

<pre><code>&lt;ul&gt;
    &lt;li&gt;
       &lt;div&gt;&lt;span&gt;test3&lt;/span&gt;&lt;/div&gt;
       &lt;div&gt;&lt;span&gt;test4&lt;/span&gt;&lt;/div&gt;
       &lt;div&gt;&lt;span&gt;test5&lt;/span&gt;&lt;/div&gt;
    &lt;/li&gt;
    &lt;li&gt;
       &lt;div&gt;&lt;span&gt;test6&lt;/span&gt;&lt;/div&gt;
       &lt;div&gt;&lt;span&gt;test7&lt;/span&gt;&lt;/div&gt;
       &lt;div&gt;&lt;span&gt;test8&lt;/span&gt;&lt;/div&gt;
    &lt;/li&gt;
&lt;/ul&gt;  
</code></pre>

<p>I am using React and underscore.js on my project.</p>