Javascript-форум - модернизировать меню-аккордеон

Javascript-форум (https://javascript.ru/forum/)

- Элементы интерфейса (https://javascript.ru/forum/dom-window/)

- - модернизировать меню-аккордеон (https://javascript.ru/forum/dom-window/47825-modernizirovat-menyu-akkordeon.html)

модернизировать меню-аккордеон

Доброго времени суток Вам!
В этом вопросе новичок, простите если вопрос покажется глупым...

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

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

<html>
<head>
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<style>
#spisok, #spisok ul
{
    list-style-type: none;
    margin: 0;
    padding: 5px 0;
}
#spisok li
{
    padding: 5px 0;
}
#spisok li li
{
    padding: 5px 0 5px 14px;
}
#spisok li li:before
{
    content: '- ';
}
</style>
</head>
<script>
$(document).ready(function(){
    $('#spisok > li > ul')
        .hide()
        .click(function(e){
        e.stopPropagation();
});
$('#spisok > li').toggle(function(){
    $(this).find('ul').slideDown();
    }, function(){
        $(this).find('ul').slideUp();
    });
});
</script>
<body>
<ul id="spisok">
<li><a href="#">1 spisok</a>
        <ul>
            <li><a href="#">1</a></li>
            <li><a href="#">2</a></li>
            <li><a href="#">3</a></li>
            <li><a href="#">4</a></li>
        </ul>
</li>
<li><a href="#">2 spisok</a>
        <ul>
            <li><a href="#">1</a></li>
            <li><a href="#">2</a></li>
        </ul>
</li>
<li><a href="#">3 spisok</a>
        <ul>
            <li><a href="#">1</a></li>
            <li><a href="#">2</a></li>
            <li><a href="#">3</a></li>
        </ul>
</li>
</ul>
</body>
</html>

Благодарю за внимание!!!

vetrox,
на форуме 100500 таких примеров и забудьте о toggle не читайте старых док

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<style>
#spisok, #spisok ul
{
    list-style-type: none;
    margin: 0;
    padding: 5px 0;

}
#spisok ul{
   display: none;
}

#spisok li
{
    padding: 5px 0;
}
#spisok li li
{
    padding: 5px 0 5px 14px;
}
#spisok li li:before
{
    content: '- ';
}

</style>
<script>
$(function(){
    $('#spisok a')
        .click(function(e){
        e.stopPropagation();
        $('#spisok a').not(this).next('ul').slideUp();
        $(this).next('ul').slideToggle()
});
});
</script>
</head>
<body>
<ul id="spisok">
<li><a href="#">1 spisok</a>
        <ul>
            <li><a href="#">1</a></li>
            <li><a href="#">2</a></li>
            <li><a href="#">3</a></li>
            <li><a href="#">4</a></li>
        </ul>
</li>
<li><a href="#">2 spisok</a>
        <ul>
            <li><a href="#">1</a></li>
            <li><a href="#">2</a></li>
        </ul>
</li>
<li><a href="#">3 spisok</a>
        <ul>
            <li><a href="#">1</a></li>
            <li><a href="#">2</a></li>
            <li><a href="#">3</a></li>
        </ul>
</li>
</ul>
</body>
</html>

отлично:dance: ! спасибо! только они открываются все в развернутом виде:( как их свернуть при открытии страницы?

Цитата:

Сообщение от vetrox

только они открываются все в развернутом виде

и в каком браузере неработает строка 15?

пардон! забыл добавить эту строчку!
:dance: :dance: :dance: сколько дней я провозился с ним....:cray:

Слава Богу за Вас, рони!