document.getelementbyid gibt null zurück

[tropenberta]

schönen guten morgen leuts

hab mal wieder ein kleines problem das ich nicht verstehe.

  
<script type="text/javascript">  
var test = window.location.pathname;  
var filename = test.substring(test.lastIndexOf('/')+1);  
if ( filename == "index.php")  
{ document.getElementById('navi1').style.color = 'red';  }  
  
if ( filename == "praxis.php")  
{ document.getElementById('navi2').style.color = 'red'; }  
  
</script>  

wie ihr sicher sehen könnt will ich je nach aufgerufener seite die schriftfarbe verändern.
jetzt bekomme ich aber einen fehler in der konsole :

TypeError: document.getElementById(...) is null

ich versteh nicht wieso. hab sonst auch immer in anderen scripten mit getElementbyId styles in der css verändert. da hatte ich nie das problem.
pls hlp.

gruss tropenberta