javascript - 在非组织列表中预选择元素<ul> <li>

我有一个用户选项列表，其中一个是系统确定的默认选项。

我将这些选项安排为列表中的可单击项。我想预选第二个项目，这是我在JQuery和CSS中尝试过的项目
jQuery的

$("ul > li:nth-child(2)").addClass("selected-state");

的CSS

.selected-state {
     background: #c24e4e;
}

.selected-state只是模仿伪类选择器活动，悬停和聚焦的行为

这行不通，没有孩子应用背景，但这可能也是Vue.js生命周期的一个因素，这不是我要问的问题。我希望从其他方法中获得灵感，以达到自己的期望

最佳答案

它工作得非常好-您甚至不需要jQuery：

ul > li:nth-child(2) {
  background: #c24e4e;
}

<ul>
  <li>One</li>
  <li>Two</li>
  <li>Three</li>
</ul>