Display title or alt text on web page

Display title or alt text on web page

At the minute I have a slideshow on my website displaying some images for
a portfolio. It works great, but now I would like to add a caption using
the alt text or title for underneath the image, in a separate box/div.
Is this possible at all? and if so does anyone know any tutorials or
resources to achieve this?
at the minute this is how I display my images
<ul class="slides">
<li><img src="Pictures/1.jpg" width="400"
height="200" title = ""alt="Marsa Alam underawter
close up" /></li>
<li><img src="Pictures/2.jpg" width="400"
height="200" alt="Marsa Alam
underawtzxcxzczxczxczxczer close up" /></li>
<li><img src="Pictures/4.jpg" width="400"
height="200" alt="Marsa Alam underawccccter close
up" /></li>
<li><img src="Pictures/3.jpg" width="400"
height="200" alt="Marsa Alam
underawtcxzczxcxzczcxcxzcer close up" /></li>
</ul>