非常简单的toggleClass无法正常工作

Question

所以我有一些非常简单的代码，但它没有用。

＆＃13;

＆＃13;

$(function() {
	$("#tren").click(function() {
		$("#trens").toggleClass("show");
	});
});

＆＃13;

.show {
    color: "red";
}

＆＃13;

<ul>
    <li id="tren">Some text</li>
</ul>
<div id="trens">
    <p>Other text</p>
</div>

＆＃13;

＆＃13;

＆＃13;

＆＃39;其他文字＆＃39;应该变红，但它没有。我做错了什么？

Answer 1

只需删除CSS中的引号即可。运行下面的代码段以查看它是否有效。

$(function() {
	$("#tren").click(function() {
		$("#trens").toggleClass("show");
	});
});

.show {
    color: red;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<ul>
    <li id="tren">Some text</li>
</ul>
<div id="trens">
    <p>Other text</p>
</div>

Answer 2

您需要做的就是从括号中取出“红色”一词。

.show {color：red;}