toggle visibility problems in internet explorer

I'm relatively new to coding but I have built a website: RateMyTeam.co.uk (fantasy football analysis) and am having some problems with compatibility issues with internet explorer. The site works perfectly in Chrome and Safari and only teething problems in Firefox. But the problems with IE are an issue as over 30% of visitors to the site use IE.

On the home page I use a javascript function to toggle the visibility of the questions that you can see, such as, " WHAT IS MY FPL ID?"

In Chrome, it does what I want it to do which is to change colour when you hover over it and be able to click on it and display the answer to the question.

Does anybody have any ideas what is wrong with my home page code that is preventing visibility toggling in IE? I've looked through numerous forums for answers and tried many things but it doesn't seem to work!! :s

Thanks,

Chris

edit

here is the code:

html bit:

<h5 style="text-shadow: #111 2px 2px 4px"><a2 href="#" onclick="toggleVisibility('foo6');">*WHAT IS MY FPL PLAYER ID?</a2></h5> 

 <div id="foo6" style="display:none;"><h6  style="margin-top:8px;margin-bottom:13px;color:#ccc">Each person who plays the fantasy football game at <a href="http://www.fantasy.premierleague.com">www.fantasy.premierleague.com</a> gets assigned a unique id. This is a number which can be as small as 1 digit and as big as 7 digits long.</h6></div> 

javascript bit:

<script src="http://code.jquery.com/jquery-latest.js"></script> 
<script type="text/JavaScript">
    functio开发者_运维问答n toggleVisibility(id) {
        var e = document.getElementById(id);
        if(e != null) { 
            if(e.style.display == 'none') {
                e.style.display = 'block';
            } else {
                e.style.display = 'none';
            }
        }
    }
</script> 

Yeah, you should only use valid HTML (4/5) tags. If you need different css for the same type of element you should be using CSS Classes. See here for more info: http://tizag.com/cssT/class.php