Simon Fabb Simon Fabb - 5 months ago 7
Javascript Question

If value in one div is higher than other

I'm trying to hide a div if the value in one div is higher than an other. So far I have this:

<div class="limit">500</div>
<div class="leased">600</div>
<div id="next">next</div>


$("#next").toggle($(".leased").text() > $(".limit").text());


So in effect if the value in the
.leased
div is higher than the value in the
.limit
div the
#next
div is hidden.

Currently I'm just seeing all divs display. I've done quite a bit of Googling, but no joy. It's probably too basic!

Answer

Your code is close, you just need to convert the values you're comparing to integers using parseInt(). You also need to reverse the comparison to hide #next when the .leased value is higher. Try this:

$("#next").toggle(parseInt($(".leased").text(), 10) < parseInt($(".limit").text(), 10));
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="limit">500</div>
<div class="leased">600</div>
<div id="next">next</div>