CODEWITHSUNDEEP
javascriptmouseeventdom-eventsmouseclick-eventonmouseclick
user13346803
user13346803

Reputation:

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

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!

Upvotes: -1

Views: 57

Answers (1)

Jack
Jack

Reputation: 569

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>

Upvotes: 1

Related Questions