unable to change a class in an included file

My website consists of only html pages

I have a menu bar, which i first put into my home page. then through javascript i changed the class of one of the link to show the current page. i worked properly.

i then shifted my menu bar into another html file, and included that file in my home page this way:

<script type="text/javascript">
         function pf_loadContent() {
             $("#MainHeader").load('usercontrols/Header.htm');
             $("#navHeader1").load('usercontrols/Navigation.htm');
             $("#MainFooter").load('usercontrols/Footer.htm');
         }
    </script>
<script language="javascript" type="text/javascript">
    pf_loadContent();
</script>

Now, when i am trying to change the class of my menu bar, it giver error that object does not exist. what is the problem?

<script language="javascript" type="text/javascript">
    function pf_HighlightMenu(strMenu, strLink) {
        document.getElementById(strMenu).className = 'tdHomeHover';
        document.getElementById(strLink).className = 'aHomeHover';
    }
    pf_HighlightMenu('menu1', 'link1');

</script>