Why onclick function isn't working in Javascript snippet below?

Question

function toggleHide(){
let btn = document.getElementById(`btn`);
let para = document.getElementById(`para`);

  if(para.style.display != 'none'){
    para.style.diplay = 'none';
    }
  else{
    para.style.display = 'block';
  }
}

<p id="para">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nulla, veniam quia natus animi quos reprehenderit
        voluptates deleniti. Nesciunt fugit adipisci veritatis asperiores tempora voluptatibus est illo nulla tenetur ex</p>
    <button id="btn" onclick="toggleHide()"> Show / Hide </button>

The code's work is to toggle the paragraph by showing and hiding it, even JS console can't identify what's going wrong here!

Answer 1

You spelled the second display wrong.

function toggleHide(){
let btn = document.getElementById(`btn`);
let para = document.getElementById(`para`);

  if(para.style.display != 'none'){
    para.style.display = 'none';
    }
  else{
    para.style.display = 'block';
  }
}

<p id="para">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nulla, veniam quia natus animi quos reprehenderit
        voluptates deleniti. Nesciunt fugit adipisci veritatis asperiores tempora voluptatibus est illo nulla tenetur ex</p>
    <button id="btn" onclick="toggleHide()"> Show / Hide </button>