Refactoring to Box

const Box = x =>
({
  map: f => Box(f(x)),
  fold: f => f(x),
  toString: () => `Box(${x})`
})

const moneyToFloat = str =>
  Box(str)
  .map(s => s.replace(/\$/g, ''))
  .map(r => parseFloat(r))

const percentToFloat = str =>
  Box(str.replace(/\%/g, ''))
  .map(replaced => parseFloat(replaced))
  .map(number => number * 0.01)

const applyDiscount = (price, discount) =>
  moneyToFloat(price)
  .fold(cost =>
    percentToFloat(discount)
    .fold(savings =>
      cost - cost * savings))

const result = applyDiscount('$5.00', '20%')
console.log(result)

<!DOCTYPE html>
<html>

  <head>
    <link rel="stylesheet" href="style.css">
  </head>

  <body>
    <!-- // make console.log write to the page for better in-browser experience -->
    <script>
        (function () {
      var body = document.querySelector('body');
      body.style['fontFamily'] = 'monospace';
      body.style['fontSize'] = '2em';
      console.log = function (x) { body.innerText += x + '\n'; };
      }());
    </script>
    <script src="script.js"></script>  
  </body>

</html>