JSFiddle - React, Tailwind, and code Playground
HTML
<p id="1"></p>
<p id="2"></p>
<p id="3"></p>
<p id="4"></p>
<p id="5"></p>
<a id="first" href="">Color First Group</a><br />
<a id="second" href="">Color Second Group</a>
CSS
p {
height: 25px;
width: 25px;
background: #FFFF00;
margin: 2px;
}
JavaScript
var one = $("#1");
var two = $("#2");
var three = $("#3");
var four = $("#4");
var five = $("#5");
var groupOne = one.add(two).add(three).add(four);
var groupTwo = groupOne.add(five);
$('#first').click(function(e){
e.preventDefault();
groupOne.css({'background': '#00FF00'});
});
$('#second').click(function(e){
e.preventDefault();
groupTwo.css({'background': '#FF0000'});
});