Отображение содержимого div с помощью jquery

Question

У меня есть ссылка на забытый пароль. При нажатии ссылки я хочу отобразить div. Вот мой демо-код. Есть что-то, чего мне не хватает. JSP код:

<form action="login" method="post"> 
<label>Username :</label> 
<input type="text" value="" name="email"> 
<label>Password :</label> 
<input type="password" value="" name="password"> 
<input class="submit" type="submit" value="Login" name="Login"> 
<div id="link" class= "link">Forgot Password?</div> 
</form> 
<div id="forget-details" class = "forget-details"> 
<h1>Forgot Your Password</h1> 
<p>Enter your registered email address and we will send you a link to reset your password.</p> 
<input type="text" value="" name="email" placeholder = "Enter your registered email"/> 

CSS:

form div.link{ 
color: #44869b; 
cursor: pointer; 
font-family: DIN,Helvetica,Arial,sans-serif; 
font-size: 12px; 
margin-top: 105px; 
text-transform: inherit; 
} 
.forget-details { 
background-color: #333; 
float: right; 
margin: 7px 0; 
padding: 11px; 
width: 97%; 
display:none; 
} 

Jquery:

$(document).ready(function(){ 
$(".link").click(function(){ 
    $(".forget_details").show(); 
    }); 
}); 

Answer 1

Вы class="forget-details" (hypen), но затем выберите $(".forget_details") (подчеркивание)

Answer 2

Либо Измените класс имя на forget_details или сделать это ch ange

$(".forget-details").show();