Can I show '$' instead of USD on payment element with user defined amount?

I have set up a user defined amount, and that is working just fine, but it displays the amount in a box followed by USD. I would GREATLY prefer that the amount show in a more traditional $xx.xx format. I do not want individual products listed there. Is there a setting I am missing? Or is this possible?

To add a dollar ($) sign in the total field of payment field, you need to inject the custom CSS code below:

@import url(//cdnjs.cloudflare.com/ajax/libs/font-awesome/4.2.0/css/font-awesome.min.css);
div#cid_30:before {
    font-family: FontAwesome;
    content: "\f155";
    position: absolute;
    height: 100%;
    width: 18px;
    line-height: 25px;
    text-align: center;
    font-size: 15px;
}
input#input_30_donation {
    width: 20%;
    padding-left: 15px;
}

Guide: How to Inject Custom CSS Codes

Please give it a try and let us know how it goes.