如何访问css上的第二个ul标签来使用javascript更改样式

Question

我有这样的HTML代码:

<div class="login">
<ul class="preLogin" > 
<div>
<li>
<input type="text" class="Nombre" id="name" placeholder="Usuario.."></li>  
</div>
<div>
<li>
<input type="password" class="pass" id="pass" placeholder="Contraseña.."></li>
</div>
<div class="botonLogin" id="BotonLogin"><p>Entrar</p></div>
</ul>
<ul >
<div>
<img src="./img/admin.png" alt="adminIcon" class="adminIcon" id="adminIcon">
<p class="textoPostLogin">¡Hola administrador!</p>
</div>
</ul>
</div>

这是CSS

.preLogin{
display: none;
}

.postLogin{
display: none;

这是文件。js

jQuery('document').ready(function ($) {   
var btnLogin = $('.botonLogin'),
menu = $('.login ul');
btnLogin.click(function(){

var name=document.getElementById("name").value;
var pass=document.getElementById("pass").value;
if (name == "admin" && pass=="admin"){
window.alert("Bienvenido a nuestro sitio web");
menu.addClass('preLogin');
menu.removeClass('postLogin');
}
});
});

我想做的是和js之前做的一样，但这次是用第二个ul:在这里输入图像描述我不知道如何访问该ul把CSS样式postlogin隐藏以显示第二个ul。

谢谢! !

我想知道如何访问第二个UL来改变css样式

Answer 1

可以在javascript中使用

var ul2 = document.querySelectorAll("ul")[1];
ul2.style.background = "#000";

在jquery中你可以使用eq:

$("ul").eq(1).css("background","#000");