Freemius Buy Button Code for a Multi-Plans Table

multi-plan-buy-button.html

<script src="https://checkout.freemius.com/js/v1/"></script>

<select id="starter-licenses">
    <option value="1" selected="selected">Single Site License</option>
    <option value="5">5-Site License</option>
    <option value="25">25-Site License</option>
    <option value="unlimited">Unlimited Sites License</option>
</select>
<button id="starter-purchase">Buy Starter</button>

<select id="pro-licenses">
    <option value="1" selected="selected">Single Site License</option>
    <option value="5">5-Site License</option>
    <option value="25">25-Site License</option>
    <option value="unlimited">Unlimited Sites License</option>
</select>
<button id="pro-purchase">Buy Professional</button>

<select id="bus-licenses">
    <option value="1" selected="selected">Single Site License</option>
    <option value="5">5-Site License</option>
    <option value="25">25-Site License</option>
    <option value="unlimited">Unlimited Sites License</option>
</select>
<button id="bus-purchase">Buy Professional</button>

<script type="text/javascript">
    (function(){
        const freemiusHandler = new FS.Checkout({
            title : '<productTitle>',
            plugin_id: '<productID>',
            public_key: '<publicKey>'
        });

        const plans = {
            starter: '104',
            pro:     '105',
            bus:     '106'
        };

        function addBuyHandler(plan, planID){
            document.querySelector('#' + plan + '-purchase').addEventListener('click', function (e) {
                freemiusHandler.open({
                    plan_id : planID,
                    licenses: document.querySelector('#' + plan + '-licenses').value,
                    // You can consume the response for after purchase logic.
                    success : function (response) {
                        // alert(response.user.email);
                    }
                });

                e.preventDefault();
            });
        }

        Object.entries(plans).forEach(([plan, planID]) => {
            addBuyHandler(plan, planID);
        });
    })();
</script>