JSFiddle - React, Tailwind, and code Playground

by revolacio

HTML

<dl>
    <dt>
        <label>с кем хочешь встретить НГ - Аня какой твой ответ?</label>
        <input type="text" value="" />
        <input type="button" placeholder="введи имя" value="узнать ответ" />
        <input type="hidden" value="Саша" />
    </dt>
    <dd>answer</dd>
</dl>

CSS

dd  {display:none;}

JavaScript

$('input[type=button]').click(function(){
    var responseContainer = $(this).closest('dt').next('dd');
    var answerEntered = $(this).prev('input[type=text]').val();
    var correctAnswer = $(this).next('input[type=hidden]').val();

    // Erase the contents of the response container.
    responseContainer.empty();
    
    if(answerEntered == correctAnswer){
        responseContainer.html('Я тебя люблю Аня!');
    } else {
        responseContainer.html('С новым 2019 годом!!! Желаю тебе счастья и любви Аня! Твой друг - ' + correctAnswer + '.');
    }
    responseContainer.show();    
});