使用 jQuery 删除具体元素

Question

我认为这是一个非常简单的问题，但我无法处理它：我的 jsp 中有一个无序列表，其中包含一些列表项，如下所示：

<li>
    <p class="text">Some text.</p>
    <table class="answer-details" style="width: 100%">
    <tbody>
        <tr class="tr">
            <td style="width: 50%;">
                <div class="msg-modification" display="inline" align="right">
                    <a id="modify" class="delete-answer" href="#">Delete</a>
                </div>
            </td>
            <td style="width: 50%; vertical-align: bottom;">
                <img src="...">
                <a class="answer-author" href="..." target="_blank">User name</a>
                <div class="answer-info">29/06/2011</div>
            </td>
        </tr>                               
    </tbody>
</table>

如您所见，每个列表项都有一个用于删除消息/答案的链接。我想做的是，使用 jQuery，当我单击链接时在同一个 li 中显示一条信息消息，并删除列表项中除该消息之外的所有内容。

这是我的 jQuery 代码：

$('.esborrar-resposta').click(function(event) {
    event.preventDefault();

    $(this).closest('.li').children('p').remove(); // it doesn't work
    $(this).closest('.tr').before('<tr><td><div class="output">Information message</div></td></tr>');
    $(this).closest('.tr').remove();
});

上面的代码删除除段落标记之外的所有内容。这是我生成的 HTML 代码：

<li>
    <p>Some text.</p>
    <table class="answer-details" style="width: 100%">
            <tbody>
                    <tr><td><div class="output">Information message</div></td></tr>                             
            </tbody>
    </table>
</li>

我想删除此段落标记，但我尝试了这些选项但没有成功：

$(this).closest('.li').children('p').remove();

并且

$(this).closest('.text').remove()

（也许它不起作用，因为段落标记不是链接标记的父级）

有人可以帮我删除它？

Answer 1

简单：

$(this).closest('.li').children('p').remove();

搜索类 li 的元素，而不是

元素。替换为：

$(this).closest('li').children('p').remove();`

---

$(this).closest('.text').remove()

将不起作用，因为 .closest() 执行以下操作：

获取与选择器匹配的第一个祖先元素，从
当前元素并在 DOM 树中向上移动。 （我的重点）

p.text 元素不是祖先，而是祖先的兄弟。因此，以下方法可能有效：

$(this).closest('li').find('.text').remove();

Answer 2

try

$("li")

而不是，

$(".li")


$(this).closest('li').children('p').remove();

因为 .li（前导点）意味着您正在搜索 class="li"，而不是

本身

Answer 3

li 不是类 $(this).closest('.li').children('p').remove();

使用 $(this).closest('li' ).children('p').remove();