Нужна помощь, сложная задача

[Jarhead]

Есть код меню, примерно такой:

<ul class="tree" style="display: block">
<li>
<span class="grower"></span>
<a href="" title="">Текст</a>
<ul style="display:none">
<li>
<span class="grower"></span>
<a href="" title="">Текст</a>
<ul>
<li>...</li>
<li class="last">...</li>
</ul>
</li>
<li class="last">...</li>
</ul>
</li>
........... разрыв ......
<li>
<span class="grower"></span>
<a href="" title="">Текст</a>
<ul style="display:none">
<li>
<span class="grower"></span>
<a href="" title="">Текст</a>
<ul>
<li>...</li>
<li class="last">...</li>
</ul>
</li>
<li class="last">...</li>
</ul>
</li>
</ul>


Нужен скрипт который бы добавлял к тэгам <ul> выделенным красным, класс, только к ним, не к внутренним. Меню генерится автоматом, в ручную скрипт не вставить где то между пунктами меню, можно только до или после.

 

[dino]

Если там (и только там) всегда есть style="display:none", то эти участки будут по умолчанию скрыты и к ним, с помощью например, jquery можно применить

<script language="javascript">
$(function(){
$("ul:hidden").attr("class", "указываем нужный класс");
});
</script>

 

[Viodele]

Если нет подключенных внешних фреймворков а-ля jQuery, то туго. В любом случае, нужно начать искать, за что-бы зацепиться. Самый простой вариант - это зацепить метод стиля "display:none". В результате, получим что-то вроде этого:

<script type="text/javascript">
    var ul_array = document.getElementsByTagName('ul');
   
    for (var i in ul_array) {
        if (typeof(ul_array[i].style) != 'object') continue;
        if (!ul_array[i].style.display) continue;
       
        if (ul_array[i].style.display == 'none') {
            ul_array[i].className = 'my_new_class';
        }
    }
</script>

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

 

[Jarhead]

Да там в подменю есть другие <ul> спрятанные.

Вот меню _Для просмотра ссылки Войди или Зарегистрируйся на этом сайте.

Вот код который его выводит:

//animate the opening of the branch (span.grower jQueryElement)
function openBranch(jQueryElement, noAnimation) {
        jQueryElement.addClass('OPEN').removeClass('CLOSE');
        if(noAnimation)
            jQueryElement.parent().find('ul:first').show();
        else
            jQueryElement.parent().find('ul:first').slideDown();
}
//animate the closing of the branch (span.grower jQueryElement)
function closeBranch(jQueryElement, noAnimation) {
    jQueryElement.addClass('CLOSE').removeClass('OPEN');
    if(noAnimation)
        jQueryElement.parent().find('ul:first').hide();
    else
        jQueryElement.parent().find('ul:first').slideUp();
}
 
//animate the closing or opening of the branch (ul jQueryElement)
function toggleBranch(jQueryElement, noAnimation) {
    if(jQueryElement.hasClass('OPEN'))
        closeBranch(jQueryElement, noAnimation);
    else
        openBranch(jQueryElement, noAnimation);
}
 
//when the page is loaded...
$(document).ready(function () {
    //to do not execute this script as much as it's called...
    if(!$('ul.tree.dhtml').hasClass('dynamized'))
    {
        //add growers to each ul.tree elements
        $('ul.tree.dhtml ul').prev().before("<span class='grower OPEN'> </span>");
       
        //dynamically add the '.last' class on each last item of a branch
        //$('ul.tree.dhtml li ul').first().addClass('unhide');
        $('ul.tree.dhtml ul li:last-child, ul.tree.dhtml li:last-child').addClass('last');
       
        //collapse every expanded branch
        $('ul.tree.dhtml span.grower.OPEN').addClass('CLOSE').removeClass('OPEN').parent().find('ul:first').hide();
        $('ul.tree.dhtml').show();
        //$('ul.tree.dhtml li ul').first().css('display', 'block');
        //open the tree for the selected branch
            $('ul.tree.dhtml .selected').parents().each( function() {
                if ($(this).is('ul'))
                    toggleBranch($(this).prev().prev(), true);
            });
            toggleBranch( $('ul.tree.dhtml .selected').prev(), true);
       
        //add a fonction on clicks on growers
        $('ul.tree.dhtml span.grower').click(function(){
            toggleBranch($(this));
        });
        //mark this 'ul.tree' elements as already 'dynamized'
        $('ul.tree.dhtml').addClass('dynamized');
 
        $('ul.tree.dhtml').removeClass('dhtml');
    }
});

Мне нужно сделать чтобы первые два пункта в нем были раскрыты, вот так:

 

[Jarhead]

Попробовал вот так:

$('ul.tree.dhtml li ul').first().css('display', 'block');

Но это открывает только первый UL

 

[Viodele]

$('ul.tree.dhtml li ul').each(function () {
    $(this).css('display', 'block');
});

Так не вариант?

 

[SandZ]

$('ul.tree li > ul:hidden').not("ul li ul li ul").show();

Работает) выпадает только второй уровень

 

[Jarhead]

Круто! Спасибо всем за ответы, ZandZ помог мне.

 

[Jarhead]

Теперь у меня другая проблема...когда список раскрывается, то меняеться "+" на "-" в меню, обозначающий раскрытие, скрытие меню. У тэга <span> в зависимости от выбора добавляется класс OPEN или CLOSE.

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

$('ul.tree li > span.grower.CLOSE').first().addClass('OPEN').removeClass('CLOSE');