Javascript 需要单击2次以关闭div

我有一个div，我想在它弹出时关闭它。我指的是类似的。唯一的变化是我给了

span

而不是按钮。现在我的问题是我需要在关闭符号上单击两次以关闭

div

我的代码

contactResault.html("
  <div id='hidediv' style='text-align:left'>
    <span id='close' onclick='this.parentNode.parentNode.parentNode.removeChild(this.parentNode.parentNode); return false;'>
      x
    </span>
    <h5 style='color:black;background-color:white!important;'>
      Thank you for Subscribing!
    </h5>
    <br/>
    <span style='color:black;background-color:white!important;'>
      Thank you for your interest in joining IEP|ONE, The Cognitive Companion for Children with Special Needs beta users group.
    </span>
    <br/>
    <br/>
    <span style='color:black;background-color:white!important;'> We will send you the link to download our Companion App from Apple and Google store as soon as it is available.
    </span>
    <br/>
    </br>
    <span style='color:black;background-color:white!important;'>Thank you!</span></br><span style='color:black;background-color:white!important;'>IEP|ONE Beta Users Team
    </span>
  </div>
");

和css

#close {
 float:right;
 display:inline-block;
 padding:2px 5px;
 background:#ccc;  
}

#close:hover {
 float:right;
 display:inline-block;
 padding:2px 5px;
 background:#ccc;
 color:#fff;
 cursor: pointer;
}

---

请帮助解决这个问题。

我第一次删除它：（但你应该用Javascript而不是HTML属性附加所有侦听器-这和

eval

）拼写问题一样糟糕，您可能需要检查

contactresult

为什么在html和javascript中都提供click事件？您是否有意使用javascript呈现html？此外，我创建了一个代码笔来复制该问题。我只需点击一次，一切看起来都很好。笔在这里：谢谢你们的评论，我签入了你们的代码笔，如果我从html中删除onclick，它在代码笔中可以正常工作，但在我的代码中它不会工作

#close {
 float:right;
 display:inline-block;
 padding:2px 5px;
 background:#ccc;  
}

#close:hover {
 float:right;
 display:inline-block;
 padding:2px 5px;
 background:#ccc;
 color:#fff;
 cursor: pointer;
}