If I have html such as:
<ul id="tags">
<li>
<a href="#">Toggle</a>
<div>Content1</div>
</li>
<li>
<a href="#">Toggle</a>
<div>Content2</div>
</li>
</ul>
How can I write a JQuery select/click event such that each 开发者_如何学Clink toggles the div below it?
$('#tags li a').click(function(){
$('#tags '+this.parent()+' div').slideToggle();
});
Tried something like that but its not giving me the results. Any help?
$('#tags li a').click(function(){
$(this).siblings("div").slideToggle();
});
or
$('#tags li a').click(function(){
$(this).next("div").slideToggle();
});
$('#tags li a').click(function(){
$(this).next('div').slideToggle();
});
[RE-EDIT]:
<script src="jquery.js"></script>
<ul id="tags">
<li style="display: none">
<a href="#">toggle</a>
<div>Content1</div>
</li>
<li>
<a href="#">toggle</a>
<div>Content2</div>
</li>
</ul>
<script>
$('ul li a').click(function(){
$("ul li").slideToggle('slow');
});
</script>
[OLD]:
<ul id="tags">
<li style="display: none">
<div>Content1</div>
</li>
<li>
<div>Content2</div>
</li>
</ul>
<a href="#" class="toggle">Toggle</a>
<script>
$('.toggle').click(function(){
$("ul li").slideToggle('slow');
});
</script>
精彩评论