trying to remove div tag based on data attribute

Question

<div class="row-container" data-i="'+data[i].product_id+'">
<div class="row-container" data-i="'+data[i].product_id+'">
<div class="row-container" data-i="'+data[i].product_id+'">
<div class="row-container" data-i="'+data[i].product_id+'">

I want to delete the row-container that contains a particular product_id. I know data('i') retrieves the value, but I dont know where to go from there.

Related post: http://stackoverflow.com/questions/1009485/jquery-filter-element-based-on-data-key-value — Cᴏʀʏ, May 21 '12 at 19:20

gdoron · Accepted Answer · 2012-05-21T19:21:10.877

41

$('.row-container').filter(function(){
    return $(this).data('i') === "product_id"
}).remove();

.data allows you to set and get other variables beside of strings (functions and objects)

You can also use this:

$('.row-container').filter('[data-i="product_id"]').remove();

Or with one selector:

$('.row-container[data-i="product_id"]').remove();

(Where "product_id" is a placeholder for the real value...)

edited May 21 '12 at 19:21

answered May 21 '12 at 19:14

gdoron

147,333
58
291
367

1

+1 Just change `"foo"` to `"product_id"` for clarity. Also isn't the last too faster? – iambriansreed May 21 '12 at 19:22
@iambriansreed. Probably yes... but it's a minor change. – gdoron May 21 '12 at 19:23

score 5 · Answer 2 · answered May 21 '12 at 19:14

5

You can use filter():

var $div = $(".row-container").filter(function() {
    return $(this).data("i") == value; // where value == product id to find
});
$div.remove();

answered May 21 '12 at 19:14

Rory McCrossan

331,213
40
305
339

@iambriansreed true, but I like to make my answers as clear as possible. – Rory McCrossan May 21 '12 at 19:17

score 5 · Answer 3 · answered May 21 '12 at 19:15

5

There's an attribute selector in jQuery that you could use to find the element that you're looking for.

$('div.row-container[data-i="<value>"]');

answered May 21 '12 at 19:15

albinohrn

626
3
8

trying to remove div tag based on data attribute

3 Answers3

Linked