Ссылка и переключатель разворота в верхнем уровне аккордеона
 

Здравствуйте, я новичок в программировании и поэтому хотя и пытаюсь разобраться сам, но все же мне нужна ваша помощь.
Я использую http://www.i-marco.nl/weblog/archive...jquery_accordi
плагин, вот рабочая площадка http://stezja.kiev.ua/index0.php.
Задача такая: добавить в верхний уровень списка графический элемент который будет сворачивать-разворачивать список, а ссылка которая обеспечивает этот функционал станет простой ссылкой :help: , т.е. при клике на ней будет осуществлен переход на другую страницу, как и должно быть в штатном режиме :write:
Система приблизительно такая:

Сначала я пробовал через background-image, но на него нельзя повесить событие :(
Подскажите пожалуйста самый простой и действенный выходи из этой ситуации :thanks:

Вам необходимо добавить в элемент <li> еще один дополнительный элемент, например <span class="toggle-visibility"></span>
клик по нему будет сворачивать-разворачивать список и переключать его же класс

$(function(){
     $('span.toggle-visibility').bind('click', function(){
         if($(this).next('ul:visible')){
              $(this).next('ul').slideUp('fast') 
         }
         else {
              $(this).next('ul').slideDown('fast')
     })
})

<li>
    	<a href="#" class="">=&gt; Ступени Духовного Роста</a>
<span class="toggle-visibility"></span>
			<ul class="acitem" style="display: none;">
		    	<li><a href="index0.php?_query=Pages./pages/trening_intuicii">Тренинг развития Интуиции</a></li>			        	
		        <li><a href="index0.php?_query=Pages./pages/kotodama_namerenie">Тренинг Котодамы «Искусство Намерения»</a></li>			        	
		        <li><a href="index0.php?_query=Pages./pages/trening_uverennosti">Тренинг уверенности в себе «Харизма Человека»</a></li>			        	
		        <li><a href="index0.php?_query=Pages./pages/prostie_uroki_duhovnogo_rosta">--&gt; 16 развивающих встреч</a></li>			        	
		        </ul>
		</li>

вот как-то так....

попробуйте... и посмотрим, что получится