JSFiddle - React, Tailwind, and code Playground

HTML

<div class="section" id="section5">

	<ul>
    Contenido
    <!--MENU-->    
	<li><a href="#" onclick='changeid()' >- Azul</a></li>
	<li><a href="#" onclick='changeid1()'>- Rojo</a></li>
	<li><a href="#" onclick='changeid2()'>- Verde</a></li>
	<li><a href="#" onclick='changeid3()'>- Amarillo</a></li>
	<li><a href="#" onclick='changeid4()'>- Morado</a></li>
	</ul>

</div>

CSS

#section5{background-color:#09C;}

#section5a{background-color:#F00;}

#section5b{background-color:#0F0;}

#section5c{background-color:#FF0;}

#section5d{background-color:#63F;}

a:link, a:visited, a:hover {color:#FFFFFF;}

JavaScript

function changeid ()
{
var e = document.getElementById("section5a");
e.id = "section5";
}

function changeid1 ()
{
var e = document.getElementById("section5");
e.id = "section5a";
}