JSFiddle - React, Tailwind, and code Playground
HTML
<ol>
<li>
<span class="title">Число обратное самому себе</span> <span class="button">Ответ</span>
<div class="question">
<p>Противоположное число n' по отношению к числу n — это число, которое при сложении с n даёт ноль. А данное явление называется взаимным уничтожением слагаемых.</p>
</div>
<div class="answer">
Число 0 противоположно самому себе.
</div>
</li>
</ol>
CSS
span{
cursor: pointer;
text-decoration: underline;
}
span:hover{
text-decoration: none;
}
li .title{
font-weight: bold;
}
li p{
text-decoration: none;
font-weight: normal;
}
li .button{
padding-left: 20px;
color: red;
}
.answer,
.question{
display: none;
}
.answer{
color: blue;
}
JavaScript
$('li').each(function(){
$(this).find('.title').click(function(){
$(this).parent().find('.question').slideToggle();
});
$(this).find('.button').click(function(){
$(this).parent().find('.answer').slideToggle();
});
});