I can't figure out this code at all

Here is the following code:

<img id="myImage" onclick="changeImage()" src="pic_bulboff.gif" width="100" height="180">

<script>
function changeImage() {
var image = document.getElementById('myImage');
if (image.src.match("bulbon")) {
image.src = "pic_bulboff.gif";
} else {
image.src = "pic_bulbon.gif";
}
}
</script>

I want to know why is the pic_bulboff.gif image shown if the image source contains the string "bulbon". Shouldn't it be the other way around? Shouldn't the pic_bulbon.gif image be shown when there is a match in the expression with the bulbon string and pic_bulboff.gif shown otherwise?

(This code is available here in the following tutorial: http://www.w3schools.com/js/tryit.asp?filename=tryjs_intro_lightbulb)