jQuery & jqTouch - ajax.load problem

I think my problem lies more in my approach and applies more to jquery, but something weird is happening here.

I'm using jQuery & jqTouch. My html is:

<div id="home" class="current">
    <div class="toolbar">
        <h1>Header</h1>
    </div>
    <ul class="rounded">
        <li class="arrow"><a href="#currentloc">Current Location</a></li>
    </ul>       
</div&开发者_运维问答gt;
<div id="currentloc">
    <div class="toolbar">
        <h1>Nearby</h1>
    </div>
</div>

What I'm trying to do is when a user clicks the Current Location link, on pageAnimationEnd I'd like to load a page and append it to #currentloc. Here's my code:

$('#currentloc').bind('pageAnimationEnd', function(e, info){
    $(this).load('results.php');
});

As you can see, this will entirely replace the contents of #currentloc. I'm not sure how I append the content of results.php without replacing what's already there. I've looked at putting the ajax load request inside of append:

$(this).append(load('results.php'));

but that totally wasn't working...

Any idea what to do?

UPDATE

One thing I've tried which works but feels a little clumsy is

$('#currentloc').bind('pageAnimationEnd', function(e, info){
 $(this).append('<ul></ul>');  
 $(this).find('ul').load('results.php');
});

Feel like there's a better solution to this.

The load function in jquery replaces the content, so you must create another element if you wish to keep the current content. You can could make your code a little shorter if you remove the call to the find function.

$('#currentloc').bind('pageAnimationEnd', function(e, info){
   $(this).append($('<ul />').load('results.php'));   
});

or

$('#currentloc').bind('pageAnimationEnd', function(e, info){
   $('<ul />').load('results.php').appendTo(this);   
});