jQuery 定位下一个位于不同级别的隐藏 div

Question

期望的结果
我有一个充满数据的表。在<td>中的每一行都是一个模态触发器。我希望该模式触发器弹出一个隐藏模式，该模式位于 <td> 之外，但仍在表内(在关闭 </tr> 之后)。点击每个触发器仅会打开其隐藏的 <div>。

问题
我似乎无法定位隐藏的 <div> ，它是上一级且是 <tr> 的同级。我尝试了 .next、.parent、.closest 和 .find 的多种变体 - 但都无济于事。如果隐藏的 <div> 直接位于 </td> 之后，使用下面的 jQuery，我可以打开它，但我不希望隐藏的 <div> 在那里...我希望它位于 </tr> 之后，如下所示。有人可以启发我吗？

CODEPEN
codepen(已更新以反射(reflect) guest271314 选择的答案)

HTML

<div class="container">
    <table>
        <!-- ROW 1 -->
        <tr>
            <td>
                <div class="quickViewTrigger">MODAL TRIGGER 1</div>
            </td>
            <td>misc cell 1</td>
            <td>misc cell 2</td>
        </tr>
        <div class="quickViewContainer">
            <div id="quickViewCloseButton" class="close" style="margin-right:10px;"><span></span></div>
                <div class="quickViewTitle">MODAL 1</div>
                <div class="quickViewBody">Lorem ipsum dolor sit amet, consectetur adipiscing elit. In lacus dolor, vestibulum id fermentum molestie, tempor in ligula. Sed quis leo a erat vehicula hendrerit. Morbi ac elementum risus. Donec pretium euismod sapien quis sagittis. Phasellus sit amet
volutpat sem.</div>
        </div>
        <!-- ROW 2 -->
        <tr>
            <td>
                <div class="quickViewTrigger">MODAL TRIGGER 2</div>
            </td>
            <td>misc cell 1</td>
            <td>misc cell 2</td>
        </tr>
        <div class="quickViewContainer">
            <div id="quickViewCloseButton" class="close" style="margin-right:10px;"><span></span></div>
            <div class="quickViewTitle">MODAL 2</div>
            <div class="quickViewBody">Lorem ipsum dolor sit amet, consectetur adipiscing elit. In lacus dolor, vestibulum id fermentum molestie, tempor in ligula. Sed quis leo a erat vehicula hendrerit. Morbi ac elementum risus. Donec pretium euismod sapien quis sagittis. Phasellus sit amet
volutpat sem.</div>
        </div>
    </table>
</div>

JQUERY

$(document).ready(function () {
    "use strict";

    // OPEN MODAL ON TRIGGER CLICK
    $(".quickViewTrigger").on('click', function () {
        var $quickview = $(this).next(".quickViewContainer");
        $quickview.dequeue().stop().slideToggle(500, "easeInOutQuart");
        $(".quickViewContainer").not($quickview).slideUp(200, "easeInOutQuart");
    });

    // CLOSE MODAL WITH MODAL CLOSE BUTTON
    $(".close").click(function() {
        $(".quickViewContainer").fadeOut();
    });

});

Answer 1

<div>不是 <table> 的有效子节点元素