JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!--Add your own HTML!-->
 <h1>Wybierz pokój do wynajęcia</h1>

<p>Zaznacz odpowiednie pola</p>
<form>Imię
    <input id='sprawdz' type='text'></input><span class="validation-flag"></span>
    <br>Naziwsko
    <input id='sprawdz2' type='text'></input><span class="validation-flag"></span>
    <br>Liczba łóżek
    <br>1<input type='checkbox'>
    <br>2<input type='checkbox'>
    <br>3<input type='checkbox'>
    <br>4<input type='checkbox'>
    <br>5<input type='checkbox'>
    <br><input id='submit' type='submit'>

CSS

/* Add your CSS below! */
 body {
    background-color: skyblue;
}
p {
    color: blue;
}
.kierwasz {
    border: 5px solid red;
}
.ok {
    background-image: url('http://www.clipartbest.com/cliparts/pT5/L46/pT5L46bTB.png');
}
.notok {
    background-image: url('http://www.kylintv.com/kylintv/marketing/images/why-kylintv/cross.png');
}

.valid {
    background-image: url(http://www.clipartbest.com/cliparts/pT5/L46/pT5L46bTB.png);
    background-size: 10px 10px;
    width: 10px;
    height: 10px;
    display: inline-block;
}
.invalid {
    background-image: url(http://www.kylintv.com/kylintv/marketing/images/why-kylintv/cross.png);
    background-size: 10px 10px;
    display: inline-block;
    width: 10px;
    height: 10px;
}

JavaScript

// Add your JavaScript below!
$(document).ready(function () {
    var check = function () {
        if (typeof ($(this).val()) === 'string' && $(this).val().length > 1) {
            $(this).next(".validation-flag").addClass("valid");
            $(this).next(".validation-flag").removeClass("invalid");
        } else {
            $(this).next(".validation-flag").addClass("invalid");
            $(this).next(".validation-flag").removeClass("valid");
        }
    };

    $('#sprawdz').change(check);
    $('#sprawdz2').change(check);
});