overflow-y:scrollな要素を一番下までスクロールするけど、いまいちぱっとしないサンプル

サンプル１ (ぺろ追加しても下にスクロールしない…) 
function add1() {
	// 行を追加するよ
	var peroZone1 = document.getElementById('peroZone1');
	var li = document.createElement('li');
	li.appendChild(document.createTextNode('追加ぺろ。'));
	peroZone1.appendChild(li)
}
サンプル２ (ぺろ追加すると下にスクロールするよ) 
function add2() {
	// 行を追加するよ
	var peroZone2 = document.getElementById('peroZone2');
	var li = document.createElement('li');
	li.appendChild(document.createTextNode('追加ぺろ。'));
	peroZone2.appendChild(li)

	// 隠しinputをfocusするよ
	document.getElementById('eom').style.display = 'inline';
	document.getElementById('eom').focus();
	setTimeout(function() { document.getElementById('eom').style.display = 'none' }, 100)
}