如何从 jquery 对象集合中删除 jquery 对象？

Question

I realize that this is somewhat of a duplicate question, I've even seen jQuery remove object from object collection question, but I'm hoping that there is a better answer that is more complete.

If I were to create a collection, such as $divs = $( 'div' ); it could return several divs in a collection, but if I needed to remove/delete one of them from the collection, not from the DOM, I don't see a jQuery command to do this. One of the suggested answers in the linked article solution says that a null is left in the collection, which I'd rather not have happen.

In my case, all of the objects in my collection 'look' the same when the collection is created, that is there are no class, attributes, or attribute value differences that I can use in a CSS Selector to exclude the object item that I want to remove from my collection. What happens is that a user clicks a button next to the item to be removed, and from that click, I determine what item needs to be removed.

I could use the button click to temporarily modify the div.drop-down-list, and then use that difference to exclude the one element when I create the jQuery collection, but I was hoping for something cleaner.

Except for the code that handles the button click and determining which div.drop-down-list to remove, here is the code I'm trying to create, except that there isn't a removeObject statement in jQuery.

$div = $( 'div.drop-down-list' ); // Get all of the drop-down-lists
$div.removeObject( $( clickedDropDownList ) ); // Create a new jQuery object for the one to exclude.
$div.hide();  // Hide/Close all the others.

It seems strange that new jQuery object items can easily be added to a collection using the add( ... ) statement, but there isn't an easy way to remove them.

Answer 1

Well I think what you want is to filter the array not to remove the target. You can try achieve this using filter method like below:

$div = $( 'div.drop-down-list' ); // Get all of the drop-down-lists
cosnt $filtered = $div.filter((ix,el)=> el !== clickedDropDownList  )
$filtered.hide(); 
// assumed that clickedDropDownList is a native element not a jQuery object.

// later on if you want to do something with all the items use the `$div` 
// if you want the previously filtered items use `$filtered`