Hi all,

I'm trying to add some debug functionality to a project I'm working on, in which debug messages can be printed as <div>s with a certain ID or class. The user can click on a link which triggers a function that changes the display property of the divs from "none" to "block"... Sounds fine so far, but there may be many divs on the same page with the same id, all of which need to be toggled when the user clicks on the link.

This is what I have so far:

PHP Code:
<style>
#debug_msg {
    
displaynone;
    
font-colorred;
}
</
style>

<
script>

//Shows/hides debug information
function showHideDebug() {
    if (
document.all.debug_msg.style.display == 'block') {
        
document.all.debug_msg.style.display'none';
       } else {
           
document.all.debug_msg.style.display 'block';
       }
}
</script> 
Then each debug message appears like this:

<div id="debug_msg">Test debug message</div>

Now, this works perfectly when there's only one message, but when there are more than one, it just does nothing

Does anyone have any ideas?

Many thanks in advance
Andy