CODEWITHSUNDEEP
jquerycssshowhidden
Hbaecklund
Hbaecklund

Reputation: 279

Show hidden object with jquery

We have a hidden ribbon and I'd like to change .hidden css in order for it to be displayed. My jquery doesn't seem to solve it?

Html

<div id="alwaysInStockRibbon" class="ribbon-wrapper-productpage hidden">
Css

Css

.hidden {
    display: none!important;
    visibility: hidden!important;

My jQuery do not work.

$(".hidden").css({"display":"Block","visibility":"visible"});

Upvotes: 1

Views: 1057

Answers (2)

Sergio Tx
Sergio Tx

Reputation: 3868

You can use show to make display back, but you will need to edit visibility too (also delete important from css):

$(".hidden").show().css("visibility","visible");
.hidden {
    display: none;
    visibility: hidden;
  }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="alwaysInStockRibbon" class="ribbon-wrapper-productpage hidden">Hello world!</div>

Upvotes: 0

Quentin Roger
Quentin Roger

Reputation: 6538

You can remove your hidden class :

$(".hidden").removeClass("hidden");
.hidden {
    display: none!important;
    visibility: hidden!important;
 }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="alwaysInStockRibbon" class="ribbon-wrapper-productpage hidden">
  aaaaaaaaaa
</div>

Upvotes: 4

Related Questions