How to insert a dynamically generated value into a tracking script with javascript?

Question

I'm currently trying to set up accurate revenue tracking between improvely and clickfunnels, and having problems getting a conversion code to work. Basically, the final order price is generated in the CF confirmation page like so:

<div class="totalprice">$67.99</div> 

And I need to insert that value into the improvely tracking script. This is currently in the header, but I'm thinking placing it in the footer may better insure the dynamic price has already loaded, but I'm not sure. I'm trying to grab the price as avariable, without the $ currency sign, just before the standard improvely script starts. but it is not working.

<script type="text/javascript" src="https://alsearsmd.iljmp.com/improvely.js"></script>
<script type="text/javascript">
var price = document.getElementsByClassName('.totalprice').innerHTML.replace('$', '');  

improvely.init('alsearsmd', 1);
improvely.conversion({
    goal: 'sale',
    revenue: price,
    reference: '123'
});
</script>

Answer 1

Your price assignment doesn't work.

Use this:

var price = document.getElementsByClassName('totalprice')[0].innerHTML.replace('$', '');

(The classname doesn't need a dot, and we need the first element of the returned array, [0])

Edit: For multiple divs, here's one way:

var price = [].slice.call(document.getElementsByClassName('totalprice')).map((div) => {
  return parseFloat(div.innerHTML.replace("$", ""));
}).reduce((a, b) => {
  return a + b;
}, 0);

Answer 2

Try this:

$(document).ready(function() {

    var prices = document.getElementsByClassName('totalprice');
    var price= 0;
    for (var i = 0; i < prices.length; i++) {
      price += parseFloat(prices[i].innerHTML.replace('$', ''));
    }

    improvely.init('alsearsmd', 1);
    improvely.conversion({
        goal: 'sale',
        revenue: price,
        reference: ''
    });

}