Javascript 切换div'；他是同一个班级的学生，但是个别的，不是一次全部的？

我有下面的HTML，因为我使用的是Wordpress，所以无法更改每个div的类

<div class="show_hide">content1</div>
<div class="extended">extension of content 1</div>
<div class="show_hide">content2</div>
<div class="extended">extension of content 2</div>

content1
内容扩展1
内容2
内容扩展2

我的jQuery脚本如下所示：

 <script type="text/javascript">

    $(document).ready(function(){


        $(".sliding").hide(0);
        $(".show_hide").show(0);

    $('.show_hide').click(function(){
    $(".sliding").slideToggle(0);
    });

});

</script>

$（文档）.ready（函数（）{
$（“.slideing”）.hide（0）；
$（“.show_hide”）.show（0）；
$（'.show_hide'）。单击（函数（）{
$（“.slide”）.slideToggle（0）；
});
});

---

现在，当点击show\u hide div时，两个类都是“extended”的div都会显示出来。我只想显示div单击的扩展名。有人能帮我吗？

如果

.extended

元素是

.show\u hide

元素的下一个兄弟元素，您可以使用：

如果中间有其他元素，则可以使用，然后将选择减少到第一个匹配（使用）：

---

在回调函数中，变量

this

将包含对触发事件的DOM节点的引用：

$(this).next().slideToggle(0);

---

@罗宾帕帕-没问题，很高兴我能帮上忙：）

$('.show_hide').click(function(){
    $(this).nextAll('.extended').eq(0).slideToggle(0);
});

$(this).next().slideToggle(0);