Skip to content
Advertisement

How to Deal with Hidden Element without Removing it – updating DOM length when Element hidden

I have a list of brand names looking like this:

enter image description here

each element has a border-bottom style and I used the below code to remove border-bottom style when there are less than 5 elements and it works perfectly until you make a search and some of these elements are hidden. The problem is because even display = ‘none’; doesn’t remove the elements from DOM. According to DOM, its length is the same so even there is one element and others are hidden border style is there. (img below code)

JavaScript

enter image description here

Removing elements from DOM instead of hiding works, but I need these elements later so I can’t remove them. I want elements to have a border If a row has more than 5 elements. How can I tackle this issue of hidden elements? Open to any suggestions.

Advertisement

Answer

I don’t know any exact property to use it, but here are some tricks you can use.
Just put the hidden element in a class and style it with display:none.

After adding that class, just use:

JavaScript
Advertisement