removing last child of parent using jquery

Question

I have a parent div called examples. I want to remove the last div in that parent div. How can I do so using jquery?

<div class="examples">
  <div class="test1"></div>
  <div class="test2"></div>
</div>

I want to remove the last child of examples, which in this case is test2 div

Possible duplicate of [remove last append element jquery](http://stackoverflow.com/questions/1650463/remove-last-append-element-jquery) — Climbatize, Dec 03 '15 at 19:14

score 8 · Answer 1 · answered Dec 03 '15 at 18:49

8

You can use find to traverse the child elements. Use div:last to select the last one, and .remove to remove it.

$(".examples").find("div:last").remove();

answered Dec 03 '15 at 18:49

Andrew Brooke

12,073
8
39
55

score 4 · Answer 2 · answered Dec 03 '15 at 18:49

4

try this one:

$('div.examples').children().last().remove();

answered Dec 03 '15 at 18:49

Rizwan Khan

474
2
7
21

score 2 · Answer 3 · answered Dec 03 '15 at 18:48

2

Try this

$('.examples').children().last().remove()

answered Dec 03 '15 at 18:48

Nikhil Aggarwal

28,197
4
43
59

1

has most legal look – CodeToLife Jan 09 '23 at 14:29

score 1 · Answer 4 · answered Dec 03 '15 at 20:31

1

Just use :last filter.

$('.examples div:last').remove();

http://jsfiddle.net/2a94hc90/

answered Dec 03 '15 at 20:31

DinoMyte

8,737
1
19
26

score 0 · Answer 5 · answered Dec 03 '15 at 18:57

0

If you want the last child of parent div is removed on clicking inner divs, try this one

$(this).parent().children().last().remove();

answered Dec 03 '15 at 18:57

Dnyaneshwar Supe

141
3

score 0 · Answer 6 · answered Dec 03 '15 at 19:14

Try using :nth-last-of-type() selector with parameter 1

$(".examples div:nth-last-of-type(1)").remove()

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
</script>
<div class="examples">
  <div class="test1">test1</div>
  <div class="test2">test2</div>
</div>

removing last child of parent using jquery

6 Answers6