Modificar lista con jQuery

[jalex16]

Hola
Tengo la siguiente lista:

Código HTML:

<ul>
  <li class="nombre">Ana</li>
  <li class="nombre">Andy</li>
  <li class="nombre">Daniel</li>
  <li class="nombre">Mary</li>
  <li class="nombre">Pedro</li>
  <li class="nombre">Patrick</li>
  <li class="nombre">Piere</li>
</ul>
 

Quiero agregar con jQuery unos encabezados con la primera letra de cada nombre, así:

Código HTML:

<ul>
  <li class="titulo">A</li>
  <li class="nombre">Ana</li>
  <li class="nombre">Andy</li>
  <li class="titulo">D</li>
  <li class="nombre">Daniel</li>
  <li class="titulo">M</li>
  <li class="nombre">Mary</li>
  <li class="titulo">P</li>
  <li class="nombre">Pedro</li>
  <li class="nombre">Patrick</li>
  <li class="nombre">Piere</li>
</ul>
 

Tienen idea de cómo hacerlo?
Gracias

[mayid]

Vos creas esto dinamicamente, con PHP? De ser así, bien podrías tener esto:

Código Javascript:

<li class="titulo A">A</li>
  <li class="nombre">Ana</li>
  <li class="nombre">Andy</li>
  <li class="titulo D">D</li>
 

Y luego seleccionar el elementos por classname.

pd: si estas generando el indice alfabetico por php, me gustaria aprender como...