How can you remove a class name and replace it with a new one?
<style>
.red {background-color: #FF0000;}
.green{background-color: #00FF00;}
.blue {background-color: #0000FF;}
</style>
<body class="red">
<ul>
<li><a href="">red</a></li>
<li><a href="">green</a></li>
<li><a href="">blue</a></li>
</ul>
</body>
In this case when you click on red or green or blue, the body class name will change accordingly. Also it will make a cookie which will save the choice.
I tried the jQuery .addClass and it's working, but it's adding a class on top of the existing one. Also I can't manage to save the cookie.