我有个小问题我想要一个分享更多内容的按钮。因此，我需要隐藏的内容，当点击显示更多和扭转也隐藏的功能。
问题是，无论我做什么，id=more中的内容总是显示出来。
我想要的不是显示在开头。
我试过这个：

<button onclick="myFunction()">More</button>
<div class="black" id="more">
    <p>I was supercool guys.... bla bla bla bla</p>
</div>
<script>
function myFunction() {
  var x = document.getElementById('more');
  if (x.style.display == "none") {
    x.style.display = "block";
  } else {
    x.style.display = "none";
  }
}
</script>

字符串
我试了一下，没有任何区别：

<button onclick="myFunction()">More</button>
<div class="black" id="more">
    <p>I was supercool guys.... bla bla bla bla</p>
</div>
<script>
function myFunction() {
  var x = document.getElementById('more');
  if (x.style.display == "block") {
    x.style.display = "none";
  } else {
    x.style.display = "block";
  }
}
</script>

型
我错过了什么？
我正在使用HTML、JavaScript和PHP。