Javascript смяна на цвета

[d0oMch0]

Значи разучавам в момента javascript-a и имам въпрос.

<html>
    <head>
        <title>..::JavaScript::..</title> 
        <link rel="stylesheet" type="text/css" href="style.css">
        <script type="text/javascript" src="test.js"></script>    
    </head>
    <body>
        <p id="red">This text is red!</p>
        <button type="button" onclick="test()">Change text color</button>
    </body>
</html>

[js]
function test()
{
document.getElementById("red").setAttribute("id","blue");

}
[/js]

Това ми е кода на html-а и на js-а и идеята е като се натисне бутона текста от червен да става син като съответно в css-a съм заложил blue тага и всичко се получава ок, но въпроса ми е как след като натисна повторно бутона да се смени пак на червено? Знам как да го направя със 2-ри бутон но с един немога да се сетя поне в момента

Благодаря предварително !

 

[bytheway]

Това е решенето. Общо взето добавих една променлива, която в началото има стойност = true. Като натиснеш бутона if проверява каква е стойността на променливата. Ако е true сменя цвета на син, ако е false го сменя на червен и т.н.

Може да се направи и с др стойности не само true и false ама аз така избрах. Успех

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
#red {
	color:#FF0000;
}
#blue {
	color:#0000CC;
}
</style>
<script type="text/javascript">

var promenliva = true;
function test()
{	
	if (promenliva) {
		document.getElementById("red").setAttribute("id","blue");
		promenliva = false;
	} else {
		document.getElementById("blue").setAttribute("id","red");
		promenliva = true;
	}
}
</script>
</head>

<body>
<p id="red">This text is red!</p>
<button type="button" onclick="test()">Change text color</button>
</body>
</html>