Como vereis en el codigo tengo una tabla con varias fila que contienen el mismo contenido, lo que quiero controlar es, que si pulso el boton cobrar de la primera fila me muestre el <div class="cobrado"> de ese fila y no en todas, llevo un rato liado pero no lo consigo, necesito algun consejo o idea de como comenzar, me seria de gran ayuda gracias :).
Código HTML:
<tr>
<td>9:00</td>
<td>
<div id="nombreCliente1">XXX</div>
<div class="botonera">
<a class="boton azul anadir img-der bordes" href="#">Cita </a>
<a class="boton azul pagar img-der bordes" href="#">Cobrar </a>
</div>
<div class="cobrado bordes"><p>Pagado</p></div>
</td>
</tr>
<tr>
<td>9:30</td>
<td>
<div id="nombreCliente2">XXX</div>
<div class="botonera">
<a class="boton azul anadir img-der bordes" href="#">Cita </a>
<a class="boton azul pagar img-der bordes" href="#">Cobrar </a>
</div>
<div class="cobrado bordes"><p>Pagado</p></div>
</td>
</tr>