.change() 导致元素内容被删除

我已经开始创建一个简单的每月付款估算器，我发现了一个奇怪的错误，只有在我更改术语选择选项时才会发生。如果您使用滑块，则每月付款会更新并通过.digits()方法在数字中添加逗号。但是，当您更改 时#loan__term，它会完全清除该数字。必须有一个冲突.change()和.digits()因为如果我删除它，该.change()方法按预期工作。有任何想法吗？

    $(document).ready(function() {
  $.fn.digits = function() {
    return this.each(function() {
      $(this).text(
        $(this)
          .text()
          .replace(/(\d)(?=(\d{3})+(?!\d))/g, "$1,")
      );
    });
  };

  function updateMonthlyPayment() {
    $loanAmount = $("#loan__amount span").html();
    $loanTerm = $("#loan__term option:selected").val();
    if ($loanTerm == "for 24 months") {
      $("#monthly__payment span")
        .html(Math.floor($loanAmount * 0.045878 / 100 * 100))
        .digits();
    } else if ($loanTerm == "for 36 months") {
      $("#monthly__payment span")
        .html(Math.floor($loanAmount * 0.032 / 100 * 100))
        .digits();
    } else if ($loanTerm == "for 48 months") {
      $("#monthly__payment span")
        .html(Math.floor($loanAmount * 0.025085 / 100 * 100))
        .digits();
    } else if ($loanTerm == "for 60 months") {
      $("#monthly__payment span")
        .html(Math.floor($loanAmount * 0.020963 / 100 * 100))
        .digits();
    }
  }

  $("#loan__amount__slider").slider({
    max: 125000,
    min: 5000, 
    step: 1000,
    value: 50000,
    create: function(event, ui) {
      $("#loan__amount__num")
        .position({
          my: "center bottom",
          at: "center top",
          of: ui.handle,
          offset: "0, 10"
        });
    },
    slide: function(event, ui) {
      $("#loan__amount span").html(ui.value);
      $("#loan__amount__num span").html(ui.value);
      updateMonthlyPayment();
      $("#loan__amount span").digits();
      $("#loan__amount__num span").digits();

      var delay = function() {
        var handleIndex = $(ui.handle).data("index.uiSliderHandle");
        $("#loan__amount__num")
          .position(
            {
              my: "center bottom",
              at: "center top",
              of: ui.handle,
              offset: "0, 10"
            }
          );
      };

      // wait for the ui.handle to set its position
      setTimeout(delay, 5);
    }
  });

  $("#loan__term").change(updateMonthlyPayment);
});

代码笔：https ://codepen.io/jrayhartley/pen/BVjdbM