JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
<li class="discounted-price">180.99</li>
<li class="special">Grand Total: £<b id="price">186.95</b></li>
</ul>

<a class="trigger" href="#">Link</a>

JavaScript

jQuery(function($) {
    $(document).on('click', '.trigger', function () {
        var originalprice = parseFloat($('#price').text()),
            discount      = parseFloat($('.discounted-price').text());

        $({someValue: originalprice})
            .animate({
                someValue: discount
            }, {
                duration: 3000,
                easing: 'swing',
                step: function (now) {
                    $('#price').text( parseInt((now * 100),10) / 100);
                }
        });
    });
});