Option 1:
If your buttons and pages are actually numbered like that, you can simply extract the number from the ID:
var $container = $('#div1');
$('[id^=button]').click(function() {
$container.load('page' + this.id.match(/\d+$/)[0] + '.php');
});
Option 2:
If that was just an example, but in reality your naming scheme is not so predictable, you can keep an object map with all the appropriate URLs:
var $container = $('#div1'),
map = {
button1: 'page1',
button2: 'page2'
// and so on...
};
$('[id^=button]').click(function() {
$container.load( map[ this.id ] );
});
Option 3:
You could store the page URL in the HTML:
<div id="button1" data-page="page1"></div>
<div id="button2" data-page="page2"></div>
and then use that in your JavaScript:
var $container = $('#div1');
$('[id^=button]').click(function() {
$container.load( $(this).attr('data-page') );
});
I personally dislike this method, since it puts behavioral stuff in your HTML.