cycle plugin and picture description

cycle plugin and picture description

Hi,

i am using cycle plugin and the *before* event like this:

function onBefore() {
   ('#desc').html(this.title);
};

$('#slides').cycle({
   fx:     'fade',
   before:   onBefore,
   pagerAnchorBuilder: function(idx, slide) {
      // return selector string for existing anchor
      return '#carousel ul li:eq(' + idx + ') a';
   }
});


html:
<ul id="slides">
   <li title="pic1"><a href="gallery/pic1.jpg" rel="group" title="pic1"><img src="gallery/pic1.jpg" alt="pic1" /></a></li>     
   <li title="pic2"><a href="gallery/pic2.jpg" rel="group" title="pic2"><img src="gallery/pic2.jpg" alt="pic2" /></a></li>   
   <li title="pic3"><a href="gallery/pic3.jpg" rel="group" title="pic3"><img src="gallery/pic3.jpg" alt="pic3" /></a></li>
   <li title="pic4"><a href="gallery/pic4.jpg" rel="group" title="pic4"><img src="gallery/pic4.jpg" alt="pic4" /></a></li>
</ul>

i have a <p id="desc"></p> object to display the title messages.
that works great for me as long as there is a title in <li> element. but what i want is to get the text from the anchor title attribute to avoid duplicate content! how can i solve this problem? its important for me to keep the unordered list!

at the end i want a smaller code like this (without title in <li>)
<ul id="slides">
   <li><a href="gallery/pic1.jpg" rel="group" title="pic1"><img src="gallery/pic1.jpg" alt="pic1" /></a></li>     
   <li><a href="gallery/pic2.jpg" rel="group" title="pic2"><img src="gallery/pic2.jpg" alt="pic2" /></a></li>   
   <li><a href="gallery/pic3.jpg" rel="group" title="pic3"><img src="gallery/pic3.jpg" alt="pic3" /></a></li>
   <li><a href="gallery/pic4.jpg" rel="group" title="pic4"><img src="gallery/pic4.jpg" alt="pic4" /></a></li>
</ul>