How to hide div using jquery or java script?

Question

Hello i would like to hide a span and a div if the value is 0.00..here is my code

<span class="price-old"> <%=getCurrentAttribute('item','custitem_sumisho_listprice')%>      </span>
<span class="price-new"><%=getCurrentAttribute('item','custitem_sumisho_onlineprice')%>  </span>
<div class="save-sale" style="font-size: .8em; padding-top: 4em"><%=getCurrentAttribute('item','custitem_sumisho_totalsave')%></div>

In the above code if the div of class="save-sale" will have 0.00 value then i would like to hide the class="price-old" and class="save-sale".Here getattribute tag will get the value of item price.

I have tried the below jquery but its not working

<script type="text/javascript" src="/site/js/jquery-1.10.2.min.js"></script>
<script>
$(function () {
if ($(".save-sale").text() == "0.00") {
$(".save-sale").hide();
$(".price-old").hide();
}
});
</script>

but this is working jsfiddle.net/u98b4fzm/2

Nitin Varpe
– Nitin Varpe

2014-10-31 05:55:39 +00:00
Commented Oct 31, 2014 at 5:55 — Nitin Varpe
– Nitin Varpe, Commented Oct 31, 2014 at 5:55

Bhushan Kawadkar · Accepted Answer · 2014-10-31 07:00:57Z

2

As you are having multiple save-sale div, you can use .each() to iterate them all and check its value for making save-sale and price-old hidden.

<script type="text/javascript" src="/site/js/jquery-1.10.2.min.js"></script>
<script>
$(function () {
  $(".save-sale").each(function(){
  if ($(this).text().trim() == "0.00") {
       $(this).hide();
       $(this).prev(".prod-price").find(".price-old").hide();
    }
  });
});
</script>

DEMO

edited Oct 31, 2014 at 7:00

answered Oct 31, 2014 at 5:52

Bhushan Kawadkar

28.6k5 gold badges39 silver badges61 bronze badges

Sign up to request clarification or add additional context in comments.

12 Comments

Bhushan Kawadkar Over a year ago

I just suggested another way to achieve same, but problem may be in jquery include otherwise code looks good.

Bhushan Kawadkar Over a year ago

have you checked any console errors? and verified that jQuery library path is correct and getting loaded in browser?

user2787474 Over a year ago

do i need to convert it to rounded value?

Bhushan Kawadkar Over a year ago

You can use trim() as suggested by Sanki in below answer or share a jsfiddle link with your problem statement to help you better. Also these are ways to check if jquery loaded or not.

user2787474 Over a year ago

may be there are lots of items and it will check the value one by one so is it a problem for script not running?

|

Grzegorz P. · Accepted Answer · 2014-10-31 06:20:11Z

0

You can use

$(".class or #id").hide()

or something similar but with used css style

$(".class or #id").css('display','none')

but if you want set this to all elements with class use obviously each function:

$(".class").each(function() { $(this).css('display','none') });

edited Oct 31, 2014 at 6:20

answered Oct 31, 2014 at 6:11

Grzegorz P.

771 gold badge1 silver badge7 bronze badges

Comments

Amit Singh · Accepted Answer · 2014-10-31 06:48:29Z

0

DEMO FIDDLE

Try this:

<script type="text/javascript" src="/site/js/jquery-1.10.2.min.js"></script>
<script>
  $(function () {
    if ($.trim($(".save-sale").text()) == "0.00") {
    $(".save-sale").hide();
    $(".price-old").hide();
  }
});
</script>

For Multiple Divs with same classname you can try the following:

$(function () {
$(".save-sale").each(function (i) {
    if ($.trim($(this).text()) == "0.00") {
        $(this).closest(".save-sale").hide();
        $(this).closest(".price-old").hide();
    }
     else{
        $(this).closest(".save-sale").show();
        $(this).closest(".price-old").show();
    }
});
});

UPDATED FIDDLE

edited Oct 31, 2014 at 6:48

answered Oct 31, 2014 at 5:57

Amit Singh

2,2754 gold badges27 silver badges50 bronze badges

1 Comment

user2787474 Over a year ago

i have multiple divs with same class name how to apply this code on divs one by one to check values and hide classes

Collectives™ on Stack Overflow

How to hide div using jquery or java script?

3 Answers 3

12 Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

12 Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related