...

View Full Version : getElementById question - Please help



savio_mf
12-01-2009, 10:11 PM
Hi Everybody,

I'd be grateful if you could help me out. I need to change the CSS by changing the id when a link is clicked.
The id is in the body tag and by default it is named 'first'. i.e
<body id="first">.
If I click on the link named 'Change id to Second', this should change to <body id="Second">.
If I further click on the link named "Change id to Second" this should change to
<body id="Third">.

My code below works (I have stripped this down to make sense), but only when I click one of the links for the first time. If I am to click the second/ third link, nothing happens:


<html>
<head>
<script type="text/javascript">
function changeFirst() {
document.getElementById('blanky').id = 'first';
document.getElementById('second').id = 'first';
document.getElementById('third').id = 'first';
}
function changeSecond() {
document.getElementById('blanky').id = 'second';
document.getElementById('first').id = 'second';
document.getElementById('third').id = 'second';
}
function changeThird() {
document.getElementById('blanky').id = 'third';
document.getElementById('first').id = 'third';
document.getElementById('second').id = 'third';
}
</script>
</head>
<body id=first><!-- I need to change this id -->
<p>Hello, the id above should change when the following links are clicked</p>
<a onclick="changeFirst()">Change id to First</a>
<a onclick="changeSecond()">Change id to Second</a>
<a onclick="changeThird()">Change id to Third</a>
</body>
</html>

Any help will be greatly appreciated.

Cheers

savio_mf
12-01-2009, 10:35 PM
Some kind soul on another forum answered this for me:

<a href="#" onclick="changebodyid('theId');">your link</a>
Code:
function changebodyid(theid) {
document.body.id = theid;
}



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum