javascript - 从该特定父级查找兄弟类来执行事件

Question

我的页面中有一个此 HTML 代码的列表 - 要求是单击 .cta-button 时，我希望隐藏 .title div 并显示 .alternate-input div(两者仅来自同一父级) ) - 我为其编写的 jquery 会触发页面上的所有 .alternate-input div 进行显示。不知道我哪里错了？

HTML

<div class="row">
    <div class="label">Abc</div>
    <div class="title">Xyz</div>
    <div class="alternate-input" style="display:none;">
       <input type="text" name="" value="Xyz">
    </div>
    <a href="#" class="cta-button">Call to action</a>
</div>

Jquery

$(".cta-button").click(function() {
    $(this).parent().siblings().find(".title").hide();
    $(this).parent().siblings().find(".alternate-input").show();
});

Answer 1

我尝试查看 jquery 文档，这似乎有效

$(".cta-button").click(function() {
    $(this).closest('div').find(".title").hide();
    $(this).closest('div').find(".alternate-input").show();
});