Remove DIV tag using Javascript or Jquery

Question

How do I remove a DIV with a specific value?

<div value="0" class="task_row"></div>

I want to remove the above div which has value 0.

Are you using a javascript library? Is jQuery going to be an acceptable answer? If so, you can do this if jQuery: $('[value="0"]').remove(); — Chi Chan
– Chi Chan, Commented Jan 21, 2011 at 5:02

Elian Ebbing · Accepted Answer · 2011-01-21 05:14:19Z

46

As Ben Rowe points out in the comments, value is not a valid attribute of the div tag. And both the jQuery solution and the solution that uses getElementsByTagName() has to iterate through a list, which is bad for performance. I think that creating an id attribute instead is a better option:

<div id="task_row_0" class="task_row"></div>

And then you can just do:

var div = document.getElementById("task_row_" + taskId);
div.parentNode.removeChild(div);

answered Jan 21, 2011 at 5:14

Elian Ebbing

19.1k5 gold badges51 silver badges56 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

user1385191 Over a year ago

Let's be realistic here. There's zero need for jQuery to do something simple such as this.

bergie3000 Over a year ago

Let's be even more realistic here. Tons of people use jQuery, so if they're already using it, why wouldn't they go for a simple single line of code. [+1 for this answer though because I happen to not be using jQuery at the moment]

TomeeNS Over a year ago

jQuery eats computer resources and hangs browsers when opened on several tabs, so please dont use it!

Zhasulan Berdibekov · Accepted Answer · 2011-01-21 05:06:58Z

4

this is jquery code )):

$('div').each(function(){
  if($(this).attr('value') == '0'){
    $(this).remove();
  }
});

answered Jan 21, 2011 at 5:06

Zhasulan Berdibekov

1,0883 gold badges20 silver badges39 bronze badges

Comments

Community · Accepted Answer · 2016-10-12 05:37:21Z

3

var divs = document.getElementsByTagName('div');
for(var i = divs.length; i; i -= 1) {
    if (divs[i].getAttribute('value') == 0) {
        divs[i].parentNode.removeChild(divs[i]);
    }
}

edited Oct 12, 2016 at 5:37

CommunityBot

11 silver badge

answered Jan 21, 2011 at 5:03

sdleihssirhc

42.6k6 gold badges56 silver badges67 bronze badges

1 Comment

Mazaher Bazari Over a year ago

I use your snippet code, but it had error. initial value for i and end condition are not valid

Andrew · Accepted Answer · 2011-01-21 05:10:19Z

2

Edit: Nevermind - Zhasulan beat me to it. :P

With jQuery -

$('div').each(function(){
    if($(this).attr('value') == '0') {
        $(this).hide();
        }
    });

answered Jan 21, 2011 at 5:10

Andrew

12.5k16 gold badges48 silver badges61 bronze badges

Comments

Aamir Shahzad · Accepted Answer · 2016-10-12 05:47:55Z

0

Alternative to jQuery/JavaScript you can achieve it via CSS only -

JSFIDDLE

div[value="0"] {
    display: none;
}

Or via jQuery using attribute selector:

JSFIDDLE

$("div[value='0']").hide(); /*.remove() as per your requirement*/

answered Oct 12, 2016 at 5:47

Aamir Shahzad

6,8848 gold badges49 silver badges72 bronze badges

Collectives™ on Stack Overflow

Remove DIV tag using Javascript or Jquery

5 Answers 5

3 Comments

Comments

1 Comment

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

3 Comments

Comments

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related