O P
O P

Reputation: 2365

How to remove element (div) based on dependent value

jsFiddle: http://jsfiddle.net/fH3Sc/

Using the given HTML (without modifying it), how can I remove the last instance of each special-text div based on a parent or neighboring div's content/attributes?

$(".special-text").slice(0, -1).remove();

This will keep the last instance of a special-text div on the page.

I want to keep the LAST UNIQUE instance of each special-text div. In the case that more divs were added to the fiddle, it should ideally only show the LAST UNIQUE instance of each special-text div.

Goal output: http://jsfiddle.net/JdbTx/

Upvotes: 2

Views: 163

Answers (5)

Dennis
Dennis

Reputation: 32598

Iterate over the different text strings and store the corresponding elements in an hash containing arrays. Then just remove the non-last elements in each array.

var texts = {};
$(".special-text").each(function() {
    var text = $(this).text();
    if(!texts.hasOwnProperty(text)) {
       texts[text] = [];
    }
    texts[text].push(this);
});

$.each(texts, function(text, elements) {
    $(elements).not(":last").remove();
});

jsFiddle demo

Or another way, based on Jan's answer that does it in a single run:

var keepers = {};
$.fn.reverse = [].reverse;
$(".special-text").reverse().filter(function() {
    var text = $(this).text(), include = keepers[text] === true;
    keepers[text] = true;
    return include;
}).remove();

Upvotes: 3

John Dvorak
John Dvorak

Reputation: 27287

There is no specific CSS selector here, but you can do this manually:

var keepers = {};

$(".special-text").each(function(){
    keepers[$(this).text()]=this
}).each(function(){
  if(keepers[$(this).text()]!=this){
    $(this).remove()
  }
})

fiddle: http://jsfiddle.net/honnza/fH3Sc/4/

The logic is as follows:

1)collect all posts that we want to keep, at most one per its contents, overwriting older entries (meaning that only the last instance of each post will make it to stay on the list)

2)remove all entries that did not stay on that list

Upvotes: 1

Arun P Johny
Arun P Johny

Reputation: 388326

You can try

var obj = {};
$('.special-text').each(function(i, v){
    obj[$(v).text()] = true;
});

$.each(obj, function(i, v){
    $('.special-text:contains(' + i + ')').not(':last').remove()
})

Demo: Fiddle

The step 1 identifies all unique special-text values, then we iterate through the list and remove all except the last item matching the special text.

Update: I would recommend the answer from Jan Dvorak as mine has some problems as noted in the comments.

Upvotes: 1

timemachine3030
timemachine3030

Reputation: 363

These two lines reproduce what you have in your second fiddle.

$(".name:contains('Jessie')").slice(0, 2).next('.special-text').remove();
$(".name:contains('Meowth')").first().next('.special-text').remove();

As the names Jessie and Meowth are not unique it is difficult to give a concise answer.

Upvotes: 0

gustavohenke
gustavohenke

Reputation: 41440

$(".post > .name:contains('Jessie')").nextAll(".special-text").remove();

See the demo here

Upvotes: -1

Related Questions