Dynamically Loading External PHP into a DIV using Prototype or scriptaculous

I'm sure this is an easy question to answer for the right person.

What I want to do is use prototype and scriptaculous to dynamically load an external PHP file into a div.

To be as percise as possible:

I have an index.php file that has a php include contained inside a div.. something like:

<div id="container" style="width="300px;"

<? include:videos_1_2_and_3.php>

</div>

So this php file would get the 3 most recent videos from the MYSQL database. (Don't worry about this I already have it coded)

Now I also have another php file called
"videos_4_5_and_6.php"

What I want to do is create a link that says "more videos" or "next page" and when it is clicked on it loads videos_4_5_and_6.php where videos_1_2_and_3.php is (IE in the "container" div).

HOWEVER... THIS IS IMPORTANT!!!!!

It must load dynamically... So if I wanted to have 10 pages each containing 3 videos, it should only load those when the more videos button is clicked.

To be clear...  I know how to do this by hiding divs or using tabs... but I need the content to load dynamically.  I can't have 10 pages of 3 videos (or 30 videos) loading at the same time it will slow performance.

THE QUESTION:
How would I code this.  So that when a link is clicked on:
like <a href="javascript: load:videos_4_5_and_6.php inside div:container>MORE VIDEOS</a> would work??

Also I must be able to use PHP files because they are the ones calling on the database.

Thanks so much for the input.