JSFiddle - React, Tailwind, and code Playground

by John Grivas

HTML

<select name="amount" id="amount" class="form-control">
    <option selected="selected" disabled="disabled">Donation Amount</option>
    <option value="500">$5.00</option>
    <option value="1000">$10.00</option>
    <option value="1500">$15.00</option>
    <option value="2000">$20.00</option>
    <option value="2500">$25.00</option>
    <option value="3000">$30.00</option>
    <option value="3500">$35.00</option>
    <option value="4000">$40.00</option>
    <option value="4500">$45.00</option>
    <option value="5000">$50.00</option>
    <option value="5500">$55.00</option>
    <option value="6000">$60.00</option>
    <option value="6500">$65.00</option>
    <option value="7000">$70.00</option>
    <option value="7500">$75.00</option>
    <option value="8000">$80.00</option>
    <option value="8500">$85.00</option>
    <option value="9000">$90.00</option>
    <option value="9500">$95.00</option>
    <option value="10000">$100.00</option>
</select>
<span class="amountShow"></span>

JavaScript

$("#amount").change(function () {
    var amount = parseInt($("#amount option:selected").val()) / 100;
    var amount = amount.toFixed(2)
    $(".amountShow").text('$' + amount);

});