Javascript-форум - onmouseover В javascript

у меня есть задание:
У нас есть кнопка и скрытый абзац с изображением.
После определения функции showImage () добавьте следующий код:

Объявите новую переменную myImage для хранения элемента «img» (вам решать, как получить доступ к этому элементу).
Определите функцию getBigger (). Эта функция должна изменить свойства стиля «ширина» и «высота» элемента myImage с «100px» на «200px». Используйте style.width и style.height, чтобы сделать это.
Определите функцию getSmaller (). Эта функция должна изменить стиль «ширина» и свойства «высота» элемента myImage обратно с «200px» на «100px». Используйте style.width и style.height, чтобы сделать это.
Установите атрибут события onmouseover в myImage. Вызовите функцию getBigger для этого события.
Установите атрибут события onmouseout в myImage. Вызовите функцию getSmaller для этого события.
Нажмите кнопку, чтобы отобразить изображение, а затем наведите на него указатель мыши, затем выйдите из изображения. Размер бургера изменится.
Мой код:

<!DOCTYPE html>
<head>

</head>
<body>
<p>
<button onclick="showImage()">Push me!</button>
</p>
<br>
<p class="hiding" style="color: navy; display: none"> Yes, it's me again!
<br>
<img src="http://ipic.su/img/img7/fs/burger.1537205489.jpg" style="width:'100px'; height:'100px'">
</p>
<script type="text/javascript">
hidingImage = document.getElementsByClassName("hiding")[0];
function showImage(){
if (hidingImage.style.display == "none"){
hidingImage.style.display = "block";
} else {
hidingImage.style.display = "none";
}
}
var myImage = document.getElementsByTagName("img")[0];
function getBigger(){
myImage.style.width = "200p";
myImage.style.height = "200px";
}
function getSmaller(){
myImage.style.width = "100px";
myImage.style.height = "100px";
}
document.getElementsByTagName("img")[0].onmouseover = getBigger;
document.getElementsByTagName("img")[0].onmouseout = getSmaller;
</script>
</body>
</html>

Помогите найти ошибку.