JSFiddle - React, Tailwind, and code Playground

HTML

<select name="" id="">
    <option value="0">Nota 0</option>
    <option value="1">Nota 1</option>
    <option value="2">Nota 2</option>
    <option value="3">Nota 3</option>
    <option value="4">Nota 4</option>
    <option value="5">Nota 5</option>
    <option value="6">Nota 6</option>
    <option value="7">Nota 7</option>
    <option value="8">Nota 8</option>
    <option value="9">Nota 9</option>
    <option value="10">Nota 10</option>
</select>
<div id="notas">
    <div>Você teve nota 0!</div>
    <div>Você teve nota 1!</div>
    <div>Você teve nota 2!</div>
    <div>Você teve nota 3!</div>
    <div>Você teve nota 4!</div>
    <div>Você teve nota 5!</div>
    <div>Você teve nota 6!</div>
    <div>Você teve nota 7!</div>
    <div>Você teve nota 8!</div>
    <div>Você teve nota 9!</div>
    <div>Você teve nota 10!</div>
</div>

CSS

#notas div {
    display: none;
    padding: 10px;
}
.mostrarNota {
    display: block !important;
}

JavaScript

var notas = document.querySelectorAll('#notas div');
document.querySelector('select').addEventListener('change', function () {
    var index = parseInt(this.value, 10);
    [].forEach.call(notas, function (div, i) {
        if (index == i) div.classList.add('mostrarNota');
        else div.classList.remove('mostrarNota');
    });
});