Переключить многоуровневый ul с mootools

Question

Приветствую, я хотел бы переключиться на огромный многоуровневый ul с mootools 1.1 или простым javascript. Список выглядит так:HTML:

 <ul>
    <li>aaa</li>
    <li>bbb</li>
    <li>ccc</li>
    <li>
        <ul>
            <li>ddd
                <ul>
                    <li>fff</li>    
                    <li>ggg</li>
                </ul>
            </li>
            <li>eee</li>
        </ul>
    </li>
 </ul>

Первоначально я хотел бы показать развернутый первый уровень, а остальные уровни свернуты, а при щелчке по каждому из элементов списка развернуть ul под ним.

Можно ли сделать это без (значительно) изменения HTML выше? Из документации я вижу, что Fx.Slide является наиболее подходящим, однако он принимает идентификатор элемента в качестве параметра, что означает, что я должен назначить идентификаторы для каждого элемента списка. Есть ли способ с помощью селекторов коллекций элементов, начиная сверху?

Answer 1

Я не уверен, почему я скажу применить с очень старой версией 1.1. Однако, по крайней мере, начиная с версии 1.2, элемент, который вам нужно передать, это либо идентификатор (как вы сказали), либо фактический элемент.

Если вы можете использовать другую версию, чем 1.1, попробуйте 1.3, которая облегчает выбор элементов, которые вы хотите.

Здесь я считаю, что вам нужно каждый <ul> элемент, который имеет прямой <li> как родитель. MooTools 1.3 имеет новый движок селектора Slick, который сделает это довольно легко: ul !> li,

Однако я не уверен (мне не удалось), что прямые дочерние селекторы работают правильно с 1.1.

Вот что я придумал: http://jsfiddle.net/rCfwq/