CODEWITHSUNDEEP
jquerycss
zac1987
zac1987

Reputation: 2777

how to change all visible:hidden into display:none by jquery?

<div style="visibility:hidden;">a</div>
<div style="visibility:visible;">b</div>
<div style="visibility:hidden;">c</div>
<div style="visibility:visible;">d</div>

if($('*').css( "visibility", "hidden" )
{
    $(This).css("display", "none");
}

How to search through entire page to find all elements that visibility :hidden and then add display:none on it? Something like the code above :

Upvotes: 0

Views: 436

Answers (2)

epascarello
epascarello

Reputation: 207527

You can select it by the style if there is no other elements and the style attribute is exact. In real world scenario, it is not reliable.

$('div[style="visibility:hidden;"]').css('display', 'none')
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div style="visibility:hidden;">a</div>
<div style="visibility:visible;">b</div>
<div style="visibility:hidden;">c</div>
<div style="visibility:visible;">d</div>

Instead select the elements you want and loop over them check that each one is set to visible or hidden. 

$('div').each(function () {
  if (this.style.visibility === 'hidden') {
    $(this).css('display', 'none')
  }
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div style="visibility:hidden;">a</div>
<div style="visibility:visible;">b</div>
<div style="visibility:hidden;">c</div>
<div style="visibility:visible;">d</div>

Upvotes: 1

Robert McKee
Robert McKee

Reputation: 21477

This works:

$('*').each(function(index, el) {
  if (el.style.visibility == 'hidden')
    el.style.display = 'none';
});

Upvotes: 0

Related Questions