如何删除包含搜索文本的父 div

Question

I am trying to remove the div that contains search text. Before I had only ul and li and I used following line of code to remove that list.

HTML

<div id="found-results">
    <div class="ui list found-result"></div>
</div>

I use append to add list to above html

$('.ui.list.found-result').filter(function() {
    return $.text([this]) === 'Tha Royal Natural Spa'; }).remove();
}

Now instead of li I have to use div. My innerHTML looks like this:

<div class="item" id="id_">
    <div class="content">
        <a class="header">Lawson 108 Mercury Tower</a>
        <div class="description">Pathum Wan Bangkok, 10330<i class="map marker icon"></i></div>
    </div>
</div>
<div class="ui divider"></div>
<div class="item" id="id_">
    <div class="content">
        <a class="header">Tha Royal Natural Spa</a>
        <div class="description">Bang Rak Bangkok, 10500<i class="map marker icon"></i></div>
    </div>
</div>
<div class="ui divider"></div>

How can I remove the parent div containing that search text?

Answer 1

In your code, you have 2 items with the same ID. Never, ever do that. IDs are meant to be unique

 $('#click').on('click', function() { var elem = $('.header').filter(function() { return ($.text([this]) === 'Tha Royal Natural Spa') }).parent().parent(); if(elem.next().hasClass('divider')) elem.next().remove(); elem.remove(); });

 .divider { background: red; height: 2px; width: 100px' }

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div class="item" id="id_1"> <div class="content"> <a class="header">Lawson 108 Mercury Tower</a> <div class="description"> Pathum Wan Bangkok, 10330 <i class="map marker icon"></i> </div> </div> </div> <div class="ui divider"></div> <div class="item" id="id_2"> <div class="content"> <a class="header">Tha Royal Natural Spa</a> <div class="description"> Bang Rak Bangkok, 10500<i class="map marker icon"></i> </div> </div> </div> <div class="ui divider"></div> <br><br> <button id="click">Remove</button>

Answer 2

请试试这个。

$( "div:contains('Tha Royal Natural Spa')" ).remove()