Scrolling to specific content inside a Div

hi
I have this problem with scrolling inside a DIV..
I have a div container which contains other two divs.. and I have 2 buttons to handle the scrolling for the 2 divs.
the two divs have their own unique IDs. i.e div1, and div2
what do I need to do in order to scroll to div1 or div2 using both buttons..?
like if I press button 1 the main div scrolls to div1. and same with button 2 and div2..

 

So kind of like a tabbed set-up but you want them to scroll? There will be plenty of scripts out there to do this, but if you want to do it yourself, what do you have so far?

 

I have this html codes:

<div style='width:300px;height:150px; overflow-y: scroll;'>
        <div id=div_1>bla bla bla bla bla blabla bla blabla bla blabla bla bla stuff1</div>

        <div id=div_2>bla bla bla bla bla blabla bla blabla bla blabla bla bla stuff2</div>

        <div id=div_3>bla bla bla bla bla blabla bla blabla bla blabla bla bla stuff3</div>

        <div id=div_4>bla bla bla bla bla blabla bla blabla bla blabla bla bla stuff4</div>
</div>
<a href=javascript:go_to('-1') >Previous </a> | <a href=javascript:go_to('1')>Next </a>

PHP:

then I have created this Javascript function to scroll content inside the div..

function go_to(page)  
{
var hashv = window.location.hash;
if(hashv == '')
	hashv = 'div_1';
	
var board = hashv.split('_');

if(page == '-1')
	{
	if(board[1] <= 1)
		board[1] = 2;
	
	var value =  board[1] - 1;
	window.location.href = '#div_'+value;
	}
else if(page == '1')
	{
	var value = parseFloat(board[1]) + 1;
	window.location.href = '#div_'+value;
	}
}

PHP:

so far this works great in firefox. but in IE I get problem. the content scrolls to the top of the page the div gets inside other divs and it gets messy...
so is there any other ways to do this?