JQuery removes all elements until id = 'whatever' found

Question

You must remove all code from the start tag to the next

I tried this

$('#page1').remove(); 

But this only removes what is between the tag.

And I don’t know what else can be between the page1 and page2 tags, because the code is dynamically added based on the types of form elements on the page

 <div id='page1' name='page1'> ... </div> <div id='another element' /> <div id=yet 'another element' /> ... <!-- Need to remove from page1 to here --> <div id='page2' name='page2'> ... </div> 

Answer 1

Assuming you want to remove page1 and everything before page2 , you can do this:

 $("#page1").nextUntil("#page2").andSelf().remove(); 

Jsfiddle example

Answer 2

If they are nested (?) And you want to remove the children in the div 'page1', you can do something like this, perhaps:

 $('#page1' > div).remove(); 

Or, if you want to selectively do this - and only delete specific divs on page 1 - you can add a class to it and do the same.

Answer 3

How about something like:

 var last = null; var curr = $('#page1'); while (curr.attr('id') != 'page2') { if (last != null) { last.remove(); } last = curr; curr = curr.next(); } if (last != null) { last.remove(); } 

Answer 4

 $('[id^="#another"]:not([id^="#page"])').each(function() { $(this).remove(); }); 

Removes all elements starting with another , but excluding elements starting with page .

Answer 5

When you need to execute an "ID" in jQuery, it is easy to use a "class" instead. For each tag that can form the set of controls that you want to remove, add class = "removeSet1". Then, if necessary, you call $(".revoveSet1").remove();