如何使用JS将样式修改为HTML元素（使用CSS外部样式）？
因此，当我点击<p>家庭类的标签时，我希望它将颜色更改为绿色，但它不起作用，并且为什么这么做。单击寄存器很好（因为console.log（“测试”）显示正常）但更改颜色的其余功能将无法正常工作。这是我的css，html和js代码（js代码包含在HTML中，所以它不是外部文件或任何东西）：
.greyRect {
height:150px;
width:1350px;
background-color: #D3D3D3;}h1 {
text-align: center;}h2 {
text-align: center;}.home {box-sizing: border-box;width:80px;height:35px;line-height: 2;
position: relative;left:350;
color:white;}.casinocraps {
background-color: grey;box-sizing: border-box;width:120px;height:35px;text-align: center;line-height: 2;
position: relative;left:460;bottom:50;
color:white;}.tictactoe {
background-color: grey;
box-sizing: border-box;
width:90px;
height:35px;
text-align: center;line-height: 2;
position: relative;left:600;bottom:100;
color:white;}.bingo {
background-color: grey;
box-sizing: border-box;
width:80px;
height:35px;
text-align: center;
line-height: 2;
position: relative;
left:700;
bottom:150;
color:white;}.concentration {
background-color: grey;
box-sizing: border-box;
width:100px;
height:35px;
text-align: center;
line-height: 2;
position: relative;
left:800;
bottom:200;
color:white;}footer {
text-align: center;
line-height: 4;
position: relative;
top:125;
right:15;
height:70px;
width:1365px;
background-color: #D3D3D3;}.border {
height: 50px;
width: 100px;
border: 4px solid green;
background-color: #555;
position: relative;
top:20;
left:100;}.rectangle {
height: 50px;
width: 100px;
background-color: #555;
position: relative;
top:50;
left:100;}