在html页面中以有序的方式显示结果

我是html新手，我想咨询您关于我遇到的一个问题。

我有一个json对象与这个结构(唯一的例子):

  {
     [{
         ServerName: "Server1",
         TestResults: [{
             Name: "Test1",
             ErrorMessage: "",
             Success: true
             },
             Name: "Test1", ErrorMessage: "", Success: true
         }]
     }, {
         ServerName: "Server2",
         TestResults: [{
             Name: "Test1",
             ErrorMessage: "",
             Success: true
             },
             Name: "Test1", ErrorMessage: "", Success: true
         }]
    }]
 }

我的javascript代码得到这个对象，并假设从它创建如下内容:

         <ul>
            <lh>ServerName</lh>
            <li><a href="#" type="button">TestName</a></li>
            <li><a href="#" type="button">TestName</a></li>
            <lh>ServerName2</lh>
            <li><a href="#" type="button">TestName</a></li>
            <li><a href="#" type="button">TestName</a></li>
            .....
        </ul>

我想知道如何创建这样一个列表，每个'lh'都有自己的一行，且每2-3个'li'在同一行。

你能帮我找到最好的解决方案吗?

p。S -我不使用表格，因为它有一些问题在jquery移动，有时使它不适合页面的大小。