我的函数仅隐藏第一个图像，不隐藏其他图像

Question

我的HTML文件中有一个单独的Javascript文件。可以隐藏第一个图像，但其他图像不隐藏。

window.onload = function goaway() {
  // hide images
  document.getElementById("cardio").style.display = "none";
  document.getElementById("hiit").style.display = "none";
  document.getElementById("strength").style.display = "none";
  document.getElementById("toning").style.display = "none";
};

<!-- program choices -->

<img src="cardio.jpg" width="350" height="200" id="cardio">
<img src="hiit.jpg" width="350" height="200" id="hiit">
<img src="strength.jpg" width="350" height="200" id="strength">
<img src="toning.jpg" width="350" height="200" id="toning">