如何仅将css应用于我在循环中单击其按钮的元素

Question

这是我的html代码，都在循环中

    <button class="edit1_hidden inline btn btn-sm btn-warning ">edit</button>
    <form class="edit_hidden"
action="/hotels/<%=hotels._id%>/comments/<%=comment._id%>/edit?_method=PUT" method="POST">
                                    <div class="form-group">
                                        <input type="text" name="comments[author]" value="<%=comment.author%>">
                                    </div>
                                    <div class="form-group">
                                        <textarea rows="5" cols="100" name="comments[text]"><%=comment.text%></textarea>
                                    </div>
                                    <div class="form-group">
                                        <input class="btn btn-primary btn-sm" type="submit" value="edit">
                                    </div>
     </form>

这是我的Java脚本，用于选择和添加CSS

$(".edit1_hidden").on("click", function(){
    $(this).css("display","none");
    $("button + .edit_hidden").show();
});

这是我的一堂课

.edit_hidden{
    display: none;
}

问题是，当我单击编辑时，该编辑按钮会隐藏，但CSS会应用于该按钮附近的每个表单，我不需要只将CSS应用于与该编辑按钮相邻的那个元素，我点击

Answer 1

您可以使用$(this).next(".edit_hidden").show()