Accessing and modifying value from one element to display in another

Hello

I am using Paddle as my payment gateway/reseller
and on my “Plans” page i want to display pricing

I am able to retrieve the price from Paddle using

<p class="paddle-gross" data-product="241xx" id="paddleprice">
                        </p>

The Paddle script source in the header is

<header>
        <h1>Fancy display heading</h1>
        <script src="https://cdn.paddle.com/paddle/paddle.js"></script>
        <script type="text/javascript">
            Paddle.Environment.set('sandbox')
            Paddle.Setup({ 
                vendor: 804xx , 
                completeDetails : true
            });
        </script>
    </header>

The price gets dispayed in local currency for eg USD 9.00

I want to format it as USD 9 and display it in another button
Also want to display monthly price so USD 3 (USD 9 is for 3 months)

How do i do that?

Thanks