javascript清除innerHTML

Question

我试图清除在id =“p1”和后来的p2中填充的html，但是现在我无法在计算功能工作之后清除它。我是javascript的新手，所以如果这个问题太新手，我会道歉。

    <section class="scoreboard">
    <div class="score1" style="display: inline-block;" >
        <p>SCOREBOARD P1</p>
        <span class="scorebox" id="p1"></span>
    </div>
    <div class="score2" style="display: inline-block;" >
        <p>SCOREBOARD P2</p>
        <span class="scorebox" id="p2"></span>
    </div>
</section>
<section>
    <input type="button" value="Calculate"   id="calculate"  onclick="calculatep1()"/>
    <input type="button" value="Clear Score" id="clearScore" onclick="clear()" />
    <input type="button" value="Next Player" id="nextPlayer" onclick="changeplayer()" />

</section>
<script>
 function calculatep1() {
 document.getElementById('p1').innerHTML=1234;
 };
 function clear() {
 document.getElementById('p1').innerHTML='';
 };
</script>