javascriptにて計算したものを表示させたいができない

前提・実現したいこと

ここに質問の内容を詳しく書いてください。
課題のフリマアプリを作成中です。
javascriptにて手数料と販売利益の計算を行いたいのですが、販売利益が表示されません。

発生している問題・エラーメッセージ

販売利益部分がNANとしか表示されない

該当のソースコード

tax.js

javascript
1function tax (){
2  const itemPrice  = document.getElementById("item-price");
3  itemPrice.addEventListener("keyup", () => {
4    const fee = itemPrice.value * 0.1;
5    const addTaxPrice = document.getElementById("add-tax-price");
6    addTaxPrice.innerHTML = `${fee}`;
7    const SalesProfit = itemPrice - fee ;
8    const profit = document.getElementById("profit");
9    profit.innerHTML = `${SalesProfit}`;
10  });
11}
12
13window.addEventListener('load', tax);
14

new.rb　ビューの該当箇所

ruby
1
2    <%# 販売価格 %>
3    <div class="sell-price">
4      <div class="weight-bold-text question-text">
5        <span>販売価格<br>(¥300〜9,999,999)</span>
6        <a class="question" href="#">?</a>
7      </div>
8      <div>
9        <div class="price-content">
10          <div class="price-text">
11            <span>価格</span>
12            <span class="indispensable">必須</span>
13          </div>
14          <span class="sell-yen">¥</span>
15          <%= f.text_field :price, class:"price-input", id:"item-price", placeholder:"例）300" %>
16        </div>
17        <div class="price-content">
18          <span>販売手数料 (10%)</span>
19          <span>
20            <span id='add-tax-price'></span>円
21          </span>
22        </div>
23        <div class="price-content">
24          <span>販売利益</span>
25          <span>
26            <span id='profit'></span>円
27        </div>
28        </span>
29      </div>
30    </div>
31    <%# /販売価格 %>