Element parentNode Property - Click on an element (<span>) to hide its parent node (<div>): - Javascript DOM

Javascript examples for DOM:Element parentNode

  1. HOME
  2. Javascript
  3. DOM
  4. Element parentNode

Description

Element parentNode Property - Click on an element (<span>) to hide its parent node (<div>):

Demo Code

ResultView the demo in separate window 

<!DOCTYPE html>
<html>
<head>
<style>
div {/*from w w w. ja  v a  2 s  . co  m*/
  box-sizing: border-box;
  padding: 16px;
  width: 100%;
  background-color: red;
  color: #fff;
}
.closebtn {
  float: right;
  font-size: 30px;
  font-weight: bold;
  cursor: pointer;
}
.closebtn:hover {
  color: #000;
}
</style>
</head>
<body>

<div>
  <span onclick="this.parentNode.style.display = 'none';" class="closebtn">&amp;times;</span>
  <p>To close this container, click on the X symbol to the right.</p>
</div>

</body>
</html>

Related Tutorials