元素存在，但.html（）不起作用

Question

触发时$(this).html()返回1但$("#inputPad > .row > div > span").click(() => { console.log("triggered click"); console.log("$(this).length: " + $(this).length); console.log("$(this).prop(id): " + $(this).prop("id")); console.log("$(this): " + $(this)); console.log("$(this).html(): " + $(this).html()); }); 会导致错误。这是代码：

<div id="inputPad" class="col s6 offset-s3 z-depth-2">
    <h4>Input Pad</h4>
    <hr>
    <div class="row">
        <div class="col s1 offset-s2"><span id="inpPad00">\sqrt{x}</span></div>
        <div class="col s1"><span id="inpPad01">\sqrt{x}</span></div>
        <div class="col s1"><span id="inpPad02">\sqrt{x}</span></div>
        <div class="col s1"><span id="inpPad03">\sqrt{x}</span></div>
        <div class="col s1"><span id="inpPad04">\sqrt{x}</span></div>
        <div class="col s1"><span id="inpPad05">\sqrt{x}</span></div>
        <div class="col s1"><span id="inpPad06">\sqrt{x}</span></div>
        <div class="col s1"><span id="inpPad07">\sqrt{x}</span></div>
    </div>
    <div class="row">
        <div class="col s1 offset-s2"><span id="inpPad10">\sqrt{x}</span></div>
        <div class="col s1"><span id="inpPad11">\sqrt{x}</span></div>
        <div class="col s1"><span id="inpPad12">\sqrt{x}</span></div>
        <div class="col s1"><span id="inpPad13">\sqrt{x}</span></div>
        <div class="col s1"><span id="inpPad14">\sqrt{x}</span></div>
        <div class="col s1"><span id="inpPad15">\sqrt{x}</span></div>
        <div class="col s1"><span id="inpPad16">\sqrt{x}</span></div>
        <div class="col s1"><span id="inpPad17">\sqrt{x}</span></div>
    </div>
</div>

以下是触发后的输出：

这是HTML：

{{1}}