Подскажите пожалуйста, а как сделать так чтобы при нажатие на заголовок спойлера он исчезал и появлялось содержимое спойлера. А при нажатие на следующий заголовок, появлялся другой и исчезал этот.
Примерно как-то так) Пробовал так, но заголовок не появляется)
HTML:
<div class="box-letter">
<div class="letter open-letter">
<b>1</b><span></span>
</div>
<ul>
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
</ul>
</div>
<div class="box-letter">
<div class="letter open-letter">
<b>2</b><span></span>
</div>
<ul>
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
</ul>
</div>
CSS:
.box-letter ul {
display:none;
}
.open-letter span:after {
content:'раскрыть';
}
Script:
$(document).ready(function() {
$('.letter').click(function() {
$('div.box-letter ul').not($(this).parent().children('div.box-letter ul')).slideUp('normal').addClass('open-letter');
$(this).parent().children('div.box-letter ul').slideDown('normal');
$(this).addClass('open-letter');
$(this).removeClass('open-letter');
});
});