document.body.style.background = 'white';
function changeMood() {
document.body.style.background === 'white' ?
document.body.style.background = 'rgb(20, 20, 20)' :
document.body.style.background = 'white';
}<section class="mode" onclick="changeMood()">
<i id="mood-icon" class="fas fa-adjust fa-2x">click</i>
</section>Why do I have to double click so that the onclick changes happen?