arvore em javascript

Estou tentando fazer o seguinte...

quando abrisse a pagina inicial mostraria o seguinte:

PAI

ele teria um evento ONCLICK, quando clicasse no filho apareceria em baixo

PAI

|---Filho

Se houvesse mais de um filho

PAI

|----Filho

|----Filho

Se o filho possuisse um filho bastava eu clicar em filho.. e através do evento onclick ele me retornaria o outro filho

PAI

|----Filho

|----Neto

|----Neto

|----Neto

|----Filho

|----Neto

|----Neto

mas tentei e nao consegui fazer a funcao em javascript

tambem tentei em php mas o evento onclick nao funcionou

ja no javascript ao eu clicar em cima ele sumia a tela e aparecia somente 1 texto