Solution to add PayPal to the list of credit card types on a storefront checkout *and* hide credit card info when PayPal is clicked.

storefront_checkout_add_paypal.html

<!-- SalsaStaff: Add PayPal to the list of credit card types on a storefront checkout.
     See https://help.salsalabs.com/hc/en-us/articles/115000065293 -->
<script type="text/javascript">
document.addEventListener('DOMContentLoaded', function() {
  if (RegExp('shop/checkOut.jsp\\?storefront_KEY=').test(window.location.href)) {
    // Script to append PayPal to credit card types in storefronts.  
    var e = document.querySelector('#cardtypes input[value="paypal"]');
    if (e === null) {
      e = document.querySelector('#cardtypes');
      e.appendChild(document.querySelector('#added-paypal'));
    }
    // Script to hide credit card information if Paypal is selected.
    // Also shows credit card info if another credit card type is selected.
    Array.from(document.querySelectorAll('#cardtypes input'))
      .forEach(function(e) {
        e.addEventListener('click', function(event) { 
          var mode = event.target.value == 'paypal' ? 'none' : 'block';
          document.querySelector('#cardInfo > table').style.display = mode;
        });
     });
  }
});
</script>
<div style="display: none;">
  <ul>
    <li id="added-paypal">
      <input type="radio" class="radio" name="cc_type" value="paypal">
      <span class="dia_field_name">PayPal</span>
    </li>
  </ul>
</div>