[rgwergwegwerg]

function show(obj) {
  var element= document.getElementById(obj);
  
    if(element.style.display == 'none')
      element.style.display = 'block';
    else
      element.style.display = 'none';
return
}

var  TreeMenu= {
	    TMroot:	[['Строительство домов', 'TreeMenu.ТMsub0'],
			 ['Ремонт квартир', 'TreeMenu.ТMsub1'],	
			 ['Ремонт машин', 'null', ''],
			 ['Ремонт бытовой техники', 'null', ''],
			 ['Ремонт электронники', 'null', ''],
			 ['IT и интернет', 'TreeMenu.ТMsub2']],
			 
	    ТMsub0:	[['Плотник', 'TreeMenu.ТMsub00', ''],
			 ['Каменщик', 'TreeMenu.ТMsub01', ''],
			 ['Земельные работы', 'TreeMenu.ТMsub02', '']],

	    ТMsub00:	[['master 0', 'null', '0']],

	    ТMsub01:	[['master 1', 'null', '1'],
			 ['master 2', 'null', '2']],

	    ТMsub02:	[['master 3', 'null', '3'],
			 ['master 4', 'null', '3'],
			 ['master 5', 'null', '3']],
	    
	    ТMsub1:	[['Сантехник', 'TreeMenu.ТMsub10'],
			 ['Отделочные работы', 'TreeMenu.ТMsub11']],

	    ТMsub10:	[['master 6', 'null', '3']],

	    ТMsub11:	[['master 7', 'null', '3'],
			 ['master 8', 'null', '3']],

	    ТMsub2:	[['Разработка сайтов', 'TreeMenu.ТMsub20']],
	    
	    ТMsub20:	[['Ученик Мастера Фу', 'null', '3']],
	    
	    TMmaster:	[[0, 54, 'Иван Иванович Иванов', '<BR>длинное описание и нудное описание конретного человека описание линное описание и нудное описание конретного человека описание и нудное описание и нудное описание конретного человека длинное описание и нудное описание конретного человека описание линное описание и нудное описание конретного человека описание и нудное описание и нудное описание конретного человека'],
			 [1, 51, 'Петрович', '<BR> описанме Петровича длинное описание и нудное описание конретного человека описание линное описание и нудное описание конретного человека описание и нудное описание и нудное описание конретного человека длинное описание и нудное описание конретного человека описание линное описание и нудное описание конретного человека описание и нудное описание и нудное описание конретного человека'],
			 [2, 51, 'Ух-бригада', '<BR> описанме ух-бригады длинное описание и нудное описание конретного человека описание линное описание и нудное описание конретного человека описание и нудное описание и нудное описание конретного человека длинное описание и нудное описание конретного человека описание линное описание и нудное описание конретного человека описание и нудное описание и нудное описание конретного человека'],
			 [3, 51, 'пустышка', '<BR> задолбался я все это писать...  длинное описание и нудное описание конретного человека описание линное описание и нудное описание конретного человека описание и нудное описание и нудное описание конретного человека длинное описание и нудное описание конретного человека описание линное описание и нудное описание конретного человека описание и нудное описание и нудное описание конретного человека']],

	    ТMdiv:	null,
	    ТMdepth:	0 };

TreeMenu.prinKey= function(){
  var tbl_tag= document.createElement("TABLE"), row, cell, i= 0,
      button1, button2;
  const COL= 3;
      tbl_tag.className= 'Title'
      row=  tbl_tag.insertRow(-1);
      for(;i< COL; i++)
	cell= row.insertCell(-1);
      
      row=  tbl_tag.insertRow(-1);
      cell= row.insertCell(-1);
      cell= row.insertCell(-1);
	button1= document.createElement('BUTTON');
	button1.innerHTML= 'свернуть всё';
	cell.appendChild(button1);
	button1= document.createElement('BUTTON');
	button1.innerHTML= 'по рейтенгу';
	cell.appendChild(button1);
	button1= document.createElement('BUTTON');
	button1.innerHTML= 'по алфавиту';
	cell.appendChild(button1);
      cell= row.insertCell(-1);
            
      row=  tbl_tag.insertRow(-1);
      for(i= 0; i< COL; i++)
	cell= row.insertCell(-1);
 
      TreeMenu.ТMdiv.appendChild(tbl_tag);
return
}

TreeMenu.init= function(id_name){ 
    TreeMenu.ТMdiv= document.getElementById(id_name);
    TreeMenu.prinKey();
return
}

TreeMenu.printItem= function(master_id){
    const ID= 0, SCR= 1, SHRT= 2, LNG= 3;
 
    for(var i= 0; i< TreeMenu.TMmaster.length; i++)
      if(TreeMenu.TMmaster[i][ID]== master_id){
	master= TreeMenu.TMmaster[i];
	break;
      }
    
    MainBlock.print(master[SHRT], master[LNG]);   
}

TreeMenu.showItem= function(ev){
    var i= 0, span_s= [];

    ev.stopPropagation? ev.stopPropagation(): ev.cancelBubble= true;  
    for(; i< this.childNodes.length; i++)
      if(this.childNodes[i].tagName== 'SPAN')
	 span_s.push(this.childNodes[i]);
    if(span_s.length)
      for(i= 0; i< span_s.length; i++)
	if(span_s[i].style.display== 'none')
	  span_s[i].style.display= 'block';
	else
	  span_s[i].style.display= 'none';
    else
      if(this.id)
	TreeMenu.printItem(this.id);
      else
	alert('нет подкатегорий');
    span_s= [];
return
}

TreeMenu.print= function(){
const ITEM= 0, NXT= 1, MST= 2;

function print_span(str, parent){
    var span_tag= document.createElement("SPAN"), i= 0;

    span_tag.innerHTML= str;
    span_tag.onclick= TreeMenu.showItem;
    span_tag.className= 'TMlevel'+ TreeMenu.ТMdepth;
    if(TreeMenu.ТMdepth)
      span_tag.style.display= 'none';
    parent.appendChild(span_tag);
return span_tag
}
 
function print_item(item, parent){
    var link_nxt= eval(item[NXT])

    parent= print_span(item[ITEM], parent);
    if(link_nxt){
	TreeMenu.ТMdepth++;
	start_print_item(link_nxt, parent);
	TreeMenu.ТMdepth--;
    }else
	parent.id= item[MST];
return
}

function start_print_item(item, parent){
    for(var i= 0; i< item.length; i++)
	print_item(item[i], parent);
return
}

start_print_item(TreeMenu.TMroot, TreeMenu.ТMdiv);
TreeMenu.ТMdepth= 0;

return
}

TreeMenu.init('menu');
TreeMenu.print();

стили при это такие:

.TMlevel0 { cursor: pointer;
display: block; }

.TMlevel1 { padding-left: 5%;
display: block; }

.TMlevel2 { padding-left: 15%;
display: block;
font-style: italic;
font-weight: bold;}