What would be prefered semantic and accessible markup for this divider list?
I'm using jQuery mobile for a project and it uses this mark-up
<ul data-role="listview" data-dividertheme="d" data-inset="true">
<li data-role="list-divider">A</li>
<li><a href="index.html">Adam Kinkaid</a></li>
<li><a href="index.html">Alex Wickerham</a></li>
<li><a href="index.html">Avery Johnson</a></li>
<li data-role="list-divider">B</li>
<li><a href="index.html">Bob Cabot</a></li>
<li data-role="list-divider">C</li>
<li><a href="index.html">Caleb Booth</a></li>
<li><a href="index.html">Christopher Adams</a></li>
</ul>
I think for dividers (A,B,C...) HTML Heading tags should be used.
Definately not ul
since it is aplhabetical it should be either ol
with list-style-type:upper-alpha;
with nested list.
I would go with a html something like:
<ol>
<li>
<ul>
<li>Adam</li>
<li>Alan</li>
</ul>
</li>
</ol>