Script to randomly output an image from one of four catagories, why does this not work?

I want this script to randomly output an image when the button is pressed. Firstly the script picks a category, and then it picks an image from that category. This is so when I further develop this code I can have it pick multiple images, but they all come from the same random category. For some reason it isn't showing the image, instead just showing the alt text. What is wrong with my code?

var types = new Array("type1", "type2", "type3", "type4");
var type1 = new Array("images/type1/image1.png","images/type1/image2.png","images/type1/image3.png","images/type1/image4.png","images/type1/image5.png");
var type2 = new Array("images/type2/image1.png","images/type2/image2.png","images/type2/image3.png","images/type2/image4.png","images/type2/image5.png");
var type3 = new Array("images/type3/image1.png","images/type3/image2.png","images/type3/image3.png","images/type3/image4.png","images/type3/image5.png");
var type4 = new Array("images/type4/image1.png","images/type4/image2.png","images/type4/image3.png","images/type4/image4.png","images/type4/image5.png");

function chooseType() {
     var randomNum1 = Math.floor(Math.random() * 4);
     var type = types[randomNum1];
     var randomNum = Math.floor(Math.random() * 5);
     document.getElementById("PicOutput").src = type[randomNum];
}
</script>

And this is in the HTML to show the image and button:

<button onclick="chooseType()">New Exersise</button> 
<img src="images/other/placertext.png" width="500" height="500" id="PicOutput" alt="Error with Image">

I can't see anything wrong with it, and I can show the images independently if I do it in the HTML, so there is nothing wrong with the images and the image paths. Any ideas? Thank you!