My code of javascript Show and hide does not work?-CodePudding

I am doing a task of shwoing and hiding container1 of confused why my code does not work My task is : to click on button of show (will display container1) And button of hide (Hiding the container1)

this is the html

function Show() {
  document.getElementById('Khenchela').style.display = 'block'
}

function Hide() {
  document.getElementById('Khenchela').style.display = 'none'
}

<!DOCTYPE html>
<html lang="en">
<meta charset="utf-8">

<link rel="stylesheet" type="text/css" href="3.css">

<head>
  <title>JAVA SCRIPT WEBSITE</title>
</head>

<body>
  <button oneclick="Show()">Hide London</button>
  <button oneclick="Hide()">Show London</button>
  <div id="Khenchela" class="container 1">
    <h3>Khenchela</h3>
    <p>Khenchela is the Tadjalt city of Algeria </p>
  </div>
  <div id="Batna" class="container 2">
    <h3>Batna </h3>
    <p>Batna is the Tnakt city of algeria</p>
  </div>
  <div id="Biskra" class="container 3">
    <h3>Biskra</h3>
    <p>Biskra is the 'after' Tnakt city of algeria</p>
  </div>
  <script src="2.js" type="text/javascript"></script>
</body>

</html>

CodePudding user response：

You have typo it should be onclick not oneclick.

function Show() {
  document.getElementById('Khenchela').style.display = 'block'
}

function Hide() {
  document.getElementById('Khenchela').style.display = 'none'
}

<!DOCTYPE html>
<html lang="en">
<meta charset="utf-8">

<link rel="stylesheet" type="text/css" href="3.css">

<head>
  <title>JAVA SCRIPT WEBSITE</title>
</head>

<body>
  <button onclick="Hide()">Hide London</button>
  <button onclick="Show()">Show London</button>
  <div id="Khenchela" class="container 1">
    <h3>Khenchela</h3>
    <p>Khenchela is the Tadjalt city of Algeria </p>
  </div>
  <div id="Batna" class="container 2">
    <h3>Batna </h3>
    <p>Batna is the Tnakt city of algeria</p>
  </div>
  <div id="Biskra" class="container 3">
    <h3>Biskra</h3>
    <p>Biskra is the 'after' Tnakt city of algeria</p>
  </div>
  <script src="2.js" type="text/javascript"></script>
</body>

</html>