querySelector() where display is not none

Question

I have a long list of

items I need to filter. I want the visible ones. Here\'s an example hidden one:

Answer 1

This whole thing is kind-of hacky, but you could use the :not() selector to invert your selection. Beware some browser normalize the style attribute, so you will want to include a selector for the space that may be normalized in.

var elements = document.querySelectorAll(
    '.newSearchResultsList li:not([style*="display:none"]):not([style*="display: none"])'
);

console.log(elements);

    
hidden 1
    
visisble 1
    
hidden 2
    
visisble 2