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