Tabs - Reloading tab content from link within tab

Tabs - Reloading tab content from link within tab

Hello!

I'm a complete newb at jquery so my apologies is this has a very obvious solution...

I am trying to use ui tabs with ajax to load content from php. I have the tabs working okay but I am trying to paginate the content using php and where I am falling over is reloading the tab content to show the next n items.

My php generates html along the lines of:

<ul>
      <li>Item 1</li>
      <li>Item 2</li>
      <li>Item 3</li>
      <li>Item 4</li>
      <li>Item 5</li>
</ul>
<a href="processcontent.php?startitem=6">Show Next 5 Items</a>

What I need is for that link to reload the tab content passing the "startitem=6" to my php page. I can see in the docs that there is a "load" and a "url" method but my lack of jquery knowledge means I simply don't know how to call them.

Can anyone help?!

Thanks,

John


[EDIT]


I've done a bit more playing with this and have added:

<script type="text/javascript"> 
  $(function() {
    $('<p><a href="#">Next<\/a><\/p>').prependTo('#pagination').find('a').click(function() {
      $('#myTabs > ul').tabs( 'url' , 0 , 'processcontent.php?startitem=<?=$startitem?>' )
      $('#myTabs > ul').tabs( 'load' , 0 )
      return false;
    });
  });
</script>

This appears to reload the page correctly but it adds in a new Next button on each click. Ideas?

Thanks,

john