javascript - 在单独的 UL 中搜索匹配的 LI 元素

Question

我正在尝试找出当用户单击按钮时如何找到具有匹配文本的“li”元素，这些元素位于两个不同的“ul”中，以便可以将它们全部删除。该按钮附加到每个“li”，我可以成功地从中获取文本并删除原始元素。 “li”是可排序的，用户可以添加更多，因此无法通过“li”的位置来完成。

现在我有这个(我删除了一些东西以使其更容易理解):

Javascript:

$("li")
    .prepend("<span class='ui-icon'></span>")    

$(".ui-icon")
    .click(function() {
        var itemText = $(this).closest("li").text();

        $(this).closest("li").fadeOut(200, function() {
            $(this).remove();
        }); 

        $("li:contains(itemText)").remove(); //the part I'm having trouble with 
    })

HTML:

<ul id="items">
    <li>
        <h3 id="title">Title1</h3>
        <p id="body">Body1</p>
    </li>
    <li>
        <h3 id="title">Title2</h3>
        <p id="body">Body2</p>
    </li>
    <li>
        <h3 id="title">Title3</h3>
        <p id="body">Body3</p>
    </li>
    <li>
        <h3 id="title">Title4</h3>
        <p id="body">Body4</p>
    </li>
</ul>
<ul id="favs">
    <li>
        <h3 id="title">Title2</h3>
        <p id="body">Body2</p>
    </li>
    <li>
        <h3 id="title">Title3</h3>
        <p id="body">Body3</p>
    </li>
    <li>
        <h3 id="title">Title1</h3>
        <p id="body">Body1</p>
    </li>
    <li>
        <h3 id="title">Title4</h3>
        <p id="body">Body4</p>
    </li>
</ul>

Answer 1

$(".ui-icon")
    .click(function() {
        var item = item.closest("li");
        var itemText = item.text();
        var parentUL = item.closest("ul");

        item.fadeOut(200, function() {
            item.remove();
        }); 

        parentUL.siblings('ul').find("li:contains(" + itemText + ")").remove(); //the part I'm having trouble with 
    })

我想这就是您要找的。这可以确保除您正在淡出的那个之外的任何一个都被删除。

顺便说一句，id 应该是唯一的。