Добрый день!
Задача такая сделать раскрывающиеся списки с неограниченным уровнем вложенности. Но при сворачивание списка третьего уровня сворачивается и родительский пункт списка.
Подозреваю ошибка в .find('>ul') но как сделать по другому не представляю.
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title></title>
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400italic,400,600&subset=latin,cyrillic' rel='stylesheet' type='text/css'>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<style>
body{
background: #f4f4f4;
font-family: 'Open Sans', Arial;
}
#wrapper{
max-width: 1000px;
min-width: 650px;
margin: 20px auto;
border: 1px solid #aaa;
background: #fff;
border-radius: 5px;
padding: 25px;
box-shadow: 0 0 7px #333;
}
li>ul{
display: none;
}
</style>
</head>
<body>
<div id="wrapper">
<ul>
<li>Действие1</li>
<li>Действие2
<ul>
<li>ПодДействие1</li>
<li>ПодДействие2</li>
<li>ПодДействие3</li>
</ul>
</li>
<li>Действие3</li>
<li>Действие4
<ul>
<li>ПодДействие1</li>
<li>ПодДействие2
<ul>
<li>ПодПодДействие1</li>
<li>ПодПодДействие2</li>
<li>ПодПодДействие3</li>
</ul>
</li>
</ul>
</li>
<li>Действие5</li>
</ul>
</div>
<script>
$(document).ready( function(){
$('li').click(function(){
if ($(this).hasClass("activ")) {
$(this).removeClass("activ")
$(this).find('>ul').slideUp(200)
}else{
$(this).addClass("activ")
$(this).find('>ul').slideDown(200)
}
});
});
</script>
</body>
</html>