Sridhar Katakam
Sridhar Katakam

Reputation: 1226

Excluding elements with a prefix and all its children in jQuery

jQuery("body *:not([id|='keep'])").removeAttr('id');

will target all elements on the page other than those whose prefix starts with keep and removes their id attribute.

Now I am trying to include not just the prefixed element but also its children in the exclusion list.

Something like the following (which doesn't work):

jQuery("body *:not([id|='keep']), body *:not([id|='keep']).find('*')").removeAttr('id');

Any ideas?

Upvotes: 0

Views: 108

Answers (1)

CertainPerformance
CertainPerformance

Reputation: 371069

You can filter every element in the collection by whether it has an ancestor that matches [id|='keep']. You can also put [id] in the initial selector to only select elements that have an ID:

jQuery("body [id]:not([id|='keep'])")
  .filter(function() { return !this.closest('[id|="keep"]') })
  .removeAttr('id');

jQuery("body [id]:not([id|='keep'])")
  .filter(function() { return !this.closest('[id|="keep"]') })
  .removeAttr('id');
  
console.log(document.body.innerHTML);
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="keep">
  <div id="child">child</div>
</div>
<div id="keep-2">keep-2</div>
<div id="somethingelse">somethingelse</div>

Upvotes: 1

Related Questions