How to delete items except for a specific identifier

Question

let's say there is a parent id that contains a lot of elements, and I want to delete all the elements except one.

ex .:

<div id = "parent_id"> <div id = "id_1"> <div id = "id_11"> </div> <div id = "id_11"> </div> </div> <div id = "id_2"> </div> <div id = "id_n"> </div> // No need to remove this id_n only </div> 

How can I remove innerHTML like this document.getElementId('parent_id').innerHTML = ''; but I do not need to remove id_n . is there any way to do this using javascript or jQuery.

Answer 1

 $("#parent_id").children(":not(#id_n)").remove(); 

Answer 2

 $("#parent_id > :not(#id_n)").remove(); 

Answer 3

I think the Attribute Not Equals selector makes sense here.

 $("#parent_id div[id!='id_n']").remove(); 

Demo version

Answer 4

For fun, POJS is some more code, but not jQuery :-)

 var p = document.getElementById('parent_id'); var d = document.getElementById('id_n'); p.innerHTML = ''; p.appendChild(d); 

Much faster .; -)

Answer 5

Removing all children other than id_n with jQuery:

 $('#parent_id div').not('#id_n').remove(); 

If you are also going to remove parent_id:

 $('#id_n').insertAfter('#parent_id'); $('#parent_id').remove();