Помогите со скриптом сворачивания текста
 

Привет. Никак не могу разобраться, почему не так работает скрипт.
Скрипт сворачивает и разворачивает текст. Проблема в том, что в родительских divах все работает, а во вложенных -нет. Хочу, чтобы разворачивалось и сворачивалось везде.
Как это реализовать с помощью данного скрипта?
Для удобства залил пример на хостинг
вот код

//here you place the ids of every element you want.
var ids=new Array('yandex','y_site','y_program','w_site','webmoney','bank');

function switchid(id){	
	hideallids();
	showdiv(id);
}

function hideallids(){
	//loop through the array and hide each element by id
	for (var i=0;i<ids.length;i++){
		hidediv(ids[i]);
	}		  
}

function hidediv(id) {
	//safe function to hide an element with a specified id
	if (document.getElementById) { // DOM3 = IE5, NS6
		document.getElementById(id).style.display = 'none';
	}
	else {
		if (document.layers) { // Netscape 4
			document.id.display = 'none';
		}
		else { // IE 4
			document.all.id.style.display = 'none';
		}
	}
}

function showdiv(id) {
	//safe function to show an element with a specified id
		  
	if (document.getElementById) { // DOM3 = IE5, NS6
		document.getElementById(id).style.display = 'block';
	}
	else {
		if (document.layers) { // Netscape 4
			document.id.display = 'block';
		}
		else { // IE 4
			document.all.id.style.display = 'block';
		}
	}
}

и хтмл

<p>Выбирай: <a href="javascript:switchid('yandex');">Яндекс</a>
<a href="javascript:switchid('webmoney');">Вебмани</a>
<a href="javascript:switchid('bank');">Банк</a>
</p>

	<div id='yandex' style="display:none;">
		<a href="javascript:switchid('y_site');">Через сайт</a><br/>
			<div id='y_site' style="display:none;">
				<p>1</p>
	</div>
		<a href="javascript:switchid('y_program');">Через программу</a>
			<div id='y_program' style="display:none;">
				<p>2</p>
	</div>
	</div>

	<div id='webmoney' style="display:none;">
		<a href="javascript:switchid('w_site');">Через сайт</a><br/>
			<div id='w_site' style="display:none;">
				<p>3</p>
			</div>
	</div>

	<div id='bank' style="display:none;">
		<p>Yet more content. This can be anything in here, html, pictures.. flash ...</p>
	</div>

вот еще картинка

а с чего бы быть видимиым диву, если его родитель невидим?
вынесите вложенные дивы из родительских, и тогда они не будут скрыватся

<div id='yandex' style="display:none;">
		<a href="javascript:switchid('y_site');">Через сайт</a><br/>

		<a href="javascript:switchid('y_program');">Через программу</a>

	</div>
			<div id='y_site' style="display:none;">
				<p>1</p>
	</div>
			<div id='y_program' style="display:none;">
				<p>2</p>
	</div>

PS закопайте пожалуйста скрипт там же где откопали. смотреть противно. это живой труп, буквально.
либо перепишите его нормально. Вставки с коментариями "// Netscape 4" просто принципиально не имеют права на жизнь

Спасибо огромное! Я в "современности" скриптов не разбираюсь, поскольку не знаю ява скрипт. Был бы благодарен за ссылку или совет, как его модернизировать

есть еще такой вариант

function switchMenu(obj) {
var el = document.getElementById(obj);
if ( el.style.display != 'none' ) {
el.style.display = 'none';
}
else {
el.style.display = '';
}
}
function $() {
var elements = new Array();
for (var i = 0; i < arguments.length; i++) {
var element = arguments[i];
if (typeof element == 'string')
element = document.getElementById(element);
if (arguments.length == 1)
return element;
elements.push(element);
}
return elements;
}
function collapseAll(objs) {
var i;
for (i=0;i<objs.length;i++ ) {
objs[i].style.display = 'none';
}
}
function pageLoad() {
collapseAll($('yandex','y_site','y_program', 'webmoney'));
}
addEvent(window,'load',pageLoad);

но он не совсем корректно работает - не сворачивает слои при загрузке - так и не смог его настроить
Залил пример
Нужно чтобы все было изначально свернуто

это форум для тех кто его знает, либо собирается знать и только начинает учить.
в разделе книги есть отличные книги для изучения JS
когда вы изучите JS до такой степени. чтобы понять что происходит вашем сркипте, вы сможете его модернизировать.для этого много знать не надо.
краткий алгоритм(один из вариантов):
при разворачивани блока, надо проврить, есть ли у него предки, из тех, что указаны в списке ID-шников.
если есть, то не сворачивать их

если же вы не собираетесь учить его, то можете обратится со своими вопросами в раздел работа, где при условии наличия времени и желания вам помогут за деньги.

Спасибо

пожалуйста.
надеюсь, вы пойдете по более трудному и более полезному для вас пути изучения JS

А не подскажете как можно отследить нажатие на одну из этих ссылок

<p><a href="javascript:switchid('yandex');">Яндекс</a>
<a href="javascript:switchid('webmoney');">Вебмани</a>
<a href="javascript:switchid('bank');">Банк</a>
</p>

чтобы к примеру если я нажимаю на Яндекс, то Вебмани и Банк меняли цвет (или шрифт или начертание, не важно что, любое CSS свойство)

мне думается, что надо отслеживать клик и присваивать двум другим новые css стили. Но как это технически реализовать? Использовать тот же getElementById или elem.setAttribute? Или использовать вот этот ваш скрипт?

я бы скорее показывал скрытое содержимое с отступом