javascript - jQuery解包多个递归节点

我正在尝试删除所有具有“ toBeRemoved”类的div，但我不确定该如何处理。我调查了展开，但无法找到与我要寻找的东西相近的东西。

是否可以轻松地摆脱这一点：

<div class="toBeRemoved">
    <div class="toBeRemoved">
        <table>
            <tbody>
                <tr>
                    <td>
                        <div class="toBeRemoved">
                            <div class="toBeRemoved">
                                <div style="text-align: left;">
                                    <div class="toBeRemoved">
                                        <div class="toBeRemoved">
                                            First node
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
    <div class="toBeRemoved">
        <table>
            <tbody>
                <tr>
                    <td>
                        <div class="toBeRemoved">
                            <div class="toBeRemoved">
                                <div style="text-align: left;">
                                    <div class="toBeRemoved">
                                        <div class="toBeRemoved">
                                            Second node.
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</div>

至

<table>
    <tbody>
        <tr>
            <td>
                <div style="text-align: left;">
                    This needs to be kept
                </div>
            </td>
        </tr>
      </tbody>
    </table>
    <table>
      <tbody>
        <tr>
            <td>
                <div style="text-align: left;">
                    This needs to be kept
                </div>
            </td>
        </tr>
      </tbody>
</table>

最佳答案

将每个.toBeRemoved元素替换为其直接子元素：

$('.toBeRemoved').each(function() {
  $(this).replaceWith($(this).children());
});

Fiddle

关于javascript - jQuery解包多个递归节点，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/36804167/