Changing one specific word to another word throughout the whole document maintaining case

I'm new to JavaScript and I just can't figure out this one thing.. I'm trying to change the specific word "katt" to "smurf" throughout the whole webpage. Every single "katt" is within a "span" tag and I can change it using this code:

for(var i=0;i<100;i++) {
  changeCat = document.getElementsByTagName("span")[i].innerHTML = "smurf";
}  

The problem is though that every single "smurf" is now only in lowercase letters, even if it's in the beginning of a sentence. I do know I need a if/else to solve my problem but I have no idea how to code it. Any help would be greatly appreciated.