Show offer depending on product price

I currently looked around for some attractive ways to engage to customers perspectives and I came across to elaborate a message for each product "depending on its price".

This topic is mainly for Business Catalyst but some expert on javascript may help.

The target is use liquid or some flexible Javascript on the small-product layout and calculate product price if higher or equal to 30 and display a you got free shipping for this product

I am currently using a jquery but not working dont know why!?

$('.price').each(function(){
    if(parseInt($(this).val()) > 30) {
   $('#get-free').show();
}
});

<div class="small-product round-corner">
 <div class="im-on-sale-{tag_onsale}">SALE</div>
 <div class="photo">{tag_smallimage}</div>
 <div class="title lato">{tag_name}</div>
<div class="price lato"><!--Price: -->{tag_saleprice}</div>
 <div class="retail-price">{tag_retailprice}</div> 
 <div class="instock">{tag_instock} IN STOCK</div>
<div id="get-free" style="display: none;">FREE SHIPPING FOR THIS PRODUCT</div>
<!--<div class="add-to-cart-small">{tag_addtocart,<img src="/images/ui-pieces/add-to-cart-small.png" width="25" height="25" />}</div>-->
<div class="lato rating-stars"><span class="smallString" style="display: none;">{tag_itemurl_nolink}</span></div>
 <div class="favorite loggedin lato"> {tag_addtofavorites,<div class="grey-link"><img src="/images/ui-pieces/favourites-icon.png" width="15" height="15">  ADD TO FAVORITES</div>, <div class="grey-link"><img src="/images/ui-pieces/close-bt.png" width="15" height="15"> REMOVE FAVORITE}</div>
</div>

Some help is much appreciated.

Thanks

Solution

Thanks to a piece of code from Vitorino I was able to come to a clear point but the real reason why it didn't get the string correctly was because of the "£" sign that was generated by the {tag_saleprice} by using .replace(/[^0-9.]/g, ""); that I used before, I was able to pass the value clear of the sign "£", below is the code for those who need:

$('.price').each(function() {
var price = $(this).text().replace(/[^0-9\.]/g, "");
   if (parseInt(price) >= 30) {
    $(this).siblings('.get-free').show();
  }
});

Demo