jCarousel make each a link from a custom loop

So for the life of me i cannot figure out how to link the whole list item. here is my code.

<div id="carousel">
<button class="prev"></button>
<div class="my-caro">
    <ul>
    <?php $my_query = new WP_Query('category_name=work&posts_per_page=3');
  while ($my_query->have_posts()) : $my_query->the_post();
  $do_not_duplicate = $post->ID; ?>

<li>
   <h2><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h2>
   <?php the_content('<p class="serif">Read the rest of this page &raquo;</p>'); ?>
</li>

  <?php endwhile; ?>
</ul>
</div><!--closes my-caro-->
<button class="next"></button>
</div><!--closes carousel-->

i tried to wrap the whole list item in a href, but it broke. i’m sure it’s something simple, any help would be awesome.

thanks