jquery has selector, to find element if it has 2 things in it

Question

I'm currently writing a filter for a selectable, I have some table cells that contain divs.

the divs have a classes named start middle & end.

essentially I want to filter out table cells that contain the div "middle", or contain BOTH "start" and "end". however, if the cell contains only "start" or "end", then it should still be selectable.

I've got the following so far,

$("#someTable tbody tr").selectable({ 
    filter: 'td:not(td:has(div.middle),
    td:has(div.start,div.end))', 
    });

but I cant figure out how to get the line

td:has(div.start,div.end))'

to do div.start AND div.end, as it's matching cells that contain either at the moment...

any help would be greatly appreciated!

Answer 1

To find elements with both a .start and .end in them, you can use:

:has(div.start):has(div.end)

In all, you could do:

$("#someTable tbody tr td").not(':has(div.start):has(div.end)').not(':has(div.middle)');