JSFiddle - React, Tailwind, and code Playground

by Porfirio Chavez

HTML

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

	<ul>
    Contenido
    <!--MENU-->    
	<li><a href="#" onclick="changeid('')">- Azul</a></li>
	<li><a href="#" onclick="changeid('a')">- Rojo</a></li>
	<li><a href="#" onclick="changeid('b')">- Verde</a></li>
	<li><a href="#" onclick="changeid('c')">- Amarillo</a></li>
	<li><a href="#" onclick="changeid('d')">- 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(clave){
var e = document.getElementById("section5");
    e.className = "section5" + clave;
    console.log("section5" + clave);
}