爲什麼不能用此按鈕刪除這個圖像

我正在嘗試練習我的編碼。我創建了一個實驗性網頁。我在這裏有我的臉的照片。我通過將圖像的顯示屬性設置爲「none」來在下面放置一個按鈕來刪除我的圖片。但是，沒有任何我嘗試似乎工作。爲什麼是這樣？這是我所有的代碼，因爲我不知道問題可能出在哪裏。爲什麼不能用此按鈕刪除這個圖像

<html> 
<head> 
    <title>TODO supply a title</title> 
    <meta charset="UTF-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 

    <style> 
     body 
     { 
      background-color: wheat; 

     } 

     .name:hover 
     { 
      background-color: aquamarine; 
     } 


     h1 { 
     width: 500px; 
border: 20px outset brown; 
padding: 20px; 
background-color: gold; 
color: goldenrod; 
text-align: center; 
margin: auto; 
     } 

     img { 
      height: 500px; 
      border: 2px solid black; 
     } 
    </style> 
</head> 
<body> 
    <h1>DENNIS MARKHAM'S FUNSITE</h1> 
    <br> 
    <p>Hi, this is <span class = "name"> Dennis</span>, and I'm creating this website just for fun. And 
    I guess for practice too.</p> 
    <p>As you can see, my name highlights when you scroll over it. Isn't that cool? 
     Well I think it is. </p> 
    <p>I think this could use a background image to give it a more...woody look. 
    But the problem is I don't understand shit about background images. That's a problem indeed. 
    </p> 
    <p>Oh well, let's do a picture:</p> 
    <br> 
    <img id = "me" src ='IMG_1742.jpg' alt='my face'> 
    <br> 
    <script type = "text/javascript"> 
     function remove(){ 
      document.getElementsById("me").style.display = "none"; 

      //not sure why this doesn't work, but okay 
     } 
    </script> 
    <button type="button" OnClick="remove()">Remove Picture</button> 


</body>

來源

2017-03-26 Dennis Markham