How to get the value of a style that gives data to an div? [MyShop E-commerce]

Question

I'm using MyShop(www.myshop.com) for my shop. But they are using a kind of programming which I never saw before.

An example of outputting the total price output in the basket.html script:

<span style="myshop-value:price-total-formatted;white-space:nowrap;"></span>

output:

€ 100,00

So this Span without any data inside it's tag output the price of the total product that has been in the basket. So i'm guessing they are using a CSS stylesheet to get get the data from, which is new for me to be honest.

I want to make a JavaScript function that output a message that depends on the price.

So when the product is under € 25 There must output a message that says example "You'll have free shipping"

and when de product is over € 25 a message must come and say "You'll have to pay for shipping".

See here the Js script for that function:

<div id="price"></div>

<p id="shipping"></p>

<script>
    var price = document.getElementById("price").innerHTML;

    if (price < 24.99) {
        document.getElementById("shipping").innerHTML = "You'll have free shipping";
    }

    if (price > 25) {
        document.getElementById("shipping").innerHTML = "You'll have to pay for shipping";
    }
</script>

The problem is when I fill the price div with a number the JS just works. But whenever I put the Span inside with the Style in it then the div couldn't find the data I guess.

I never saw this kind or programming, I've googled but I just couldn't find something(or I just googled wrong). A solution will be great, but a explanation about this way of programming would also be grateful.

Answer 1

Take a look at this fiddle - http://jsfiddle.net/2mdmz3bq/

var innerHtml = $('#theLabel').html();
var intVal = parseInt(innerHtml.match(/\d+/)[0]);

You'll need a way to find the span in javascript so i added an id attribute. After we get the inner html we need to get rid of the euro/dollar sign and convert the resulted string to an integer.