Javascript 当您在iframe内部单击时，如何在iframe的父div中添加类？

我在一个页面中有四个框架，每个iframe都有自己的内容和父div，其中包含一些类

以下是该页面的屏幕截图：

要求：在每个面板中都有一些链接，当您单击这些链接时，可以使用AJAX调用其他页面，如第二幅图所示

以下是HTML代码：

<div class="north-center border">
    <div class="linksDetails">
        <div class="panelLinks">
            <ul>
            <li><a href="javascript:ajaxpage('fxtraders.html', 'panel1');">FX Traders</a></li>
            <li><a href="javascript:ajaxpage('fxcharting.html', 'panel1');">Fx Charting</a></li>
            <!--<li><a href="javascript:ajaxpage('fxbonds.html', 'panel1');">FI Inventory (Bonds)</a></li>-->
            <li><a href="javascript:ajaxpage('fxwatcher.html', 'panel1');">FX RATE WATCHER</a></li>
            </ul>
        </div>
    </div>
    <div class="open-row-box" id="panel1"></div>
</div>

主要要求：

我怎样才能单独隐藏我的内容面板，就像我单击第一个面板交叉图标时，它只隐藏第一个面板，当我单击第二个面板时，它只隐藏第二个面板一样

---

提前感谢：）

这是获取iframe的父级的方法

var parent = $(window.frameElement).parent();

var parent = $(window.frameElement).parent();