Unordered list in HTML5 with a list/group name

How would you create an unordered开发者_开发知识库 list of items in HTML5 with a group name at the top? The items should look indented.

Ex:

GroupName1
    Item1
    Item2
    Item3
GroupName2
    Item4
    Item5

Why not just do a list within a list?

<ul>
  <li>
    Group 1
    <ul>
      <li>Item 1</li>
      <li>Item 2</li>
      <li>Item 3</li>
    </ul>
  </li>
  <li>
    Group 2
    <ul>
      <li>Item 4</li>
      <li>Item 5</li>
    </ul>
  </li>
</ul>

I reckon scurker’s answer is the way to go, but if your groups were really separate from each other, and thus didn’t really make sense in one big list, you could do this:

<section>
    <h1>GroupName1</h1>

    <ul>
        <li>Item1</li>
        <li>Item2</li>
        <li>Item3</li>
    </ul>
</section>

<section>
    <h1>GroupName2</h1>

    <ul>
        <li>Item4</li>
        <li>Item5</li>
    </ul>
</section>