classList.remove not working

Question

I am trying to show results of a quiz by using classList.remove but this is not working.

This is my HTML. The results are inside a div and inside this div are 5 other divs with a class. The idea is that when submit your answers, the class of one of the divs is removed.

<div class="uitslag">
    <div class="ShuriPartner">
        <h3>Shuri</h3>
        <p>Jouw superheld partner is Shuri. Je bent ontzettend sterk en vastberaden, maar je hebt iemand nodig die slim is. Shuri is de slimste superheld en is daarom perfect voor jouw.</p>
        <img src="images/shuri.png" alt="Shuri">
        <!--Afbeelding via https://metropolis-hero1125.deviantart.com/art/Thor-Ragnarok-Thor-PNG-694373927-->
    </div>

    <div class="RocketPartner">
        <p>Jouw superheld partner is Rocket. Je bent sterk , maar je hebt iemand nodig die slim is. Rocket is slim en heeft altijd een oplossing om uit de problemen te komen, perfect voor jou!</p>
        <img src="images/rocket.png" alt="Rocket">
        <!--Afbeelding via http://collectionstash.com/collectibles/catalog/page:22/sort:Manufacture.title/direction:asc?url=collectibles%2Fsearch&m=2&o=a-->
    </div>

    <div class="ThorPartner">
        <p>Jouw superheld partner is Thor. Je bent slim, maar niet , maar je hebt iemand nodig die sterk is en iemand kan is. Thor is sterk en kan een groep leiden, en is daarom perfect voor jouw.</p>
        <img src="images/thor.png" alt="Thor">
        <!--Afbeelding via http://www.eonline.com/photos/20422/thor-ragnarok-movie-pics/786575-->
    </div>

    <div class="WinterSoldierPartner">
        <p>Jouw superheld partner is de Winter Soldier. Je bent slim maar niet zo slim. Je hebt iemand nodig die sterk is. De Winter Solder kan goed omgaan met wapens en doet precies wat jij zegt en kan jouw goed helpen.</p>
        <img src="images/wintersoldier.png" alt="Winter Soldier">
        <!--Afbeelding via http://www.eonline.com/photos/20422/thor-ragnarok-movie-pics/786575-->
    </div>

    <div class="HulkPartner">
        <p>Jouw superheld partner is de Hulk. Je bent slim maar niet zo slim. Je hebt iemand nodig die sterk is. De Hulk is ontzettend sterk en kan jouw goed helpen.</p>
        <img src="images/hulk.png" alt="Hulk">
        <!--Afbeelding via http://ultimate-marvel-cinematic-universe.wikia.com/wiki/Hulk-->
    </div>
</div>

This is my Javascript

function jouwPartner(event) {
//Hier een preventdevault omdat wanneer op verzendenn wordt gedrukt deze functie als eerst wordt aangeroepen.
event.preventDefault();
var punten = vijand() + eigenschappen() + kleurKiezen() + rekenen();
var superhelden = ['Shuri', 'Rocket', 'Thor', 'Winter Soldier', 'Hulk'];
var partner;
var i;

for (i = 0; i < superhelden.length; i++) {
    if (punten === 0) {
        partner = superhelden[0];
    } else if (punten === 1) {
        partner = superhelden[1];
    } else if (punten === 2) {
        partner = superhelden[2];
    } else if (punten === 3) {
        partner = superhelden[3];
    } else if (punten === 4) {
        partner = superhelden[4];
    }
}

//Roep hier de verhaal(partner); aan, omdat ik in de if/else statements partner gebruik. Ik stop de variable in de parameter. Als superhelden bijv. Shuri is wordt partner superhelden en wordt dit meegegeven als parameter voor de functie verhaal.
verhaal(partner); }



//Deel 6: Bericht aan gebruiker
function verhaal(persoon) {
var tekst1 = document.querySelector('.uitslag > div:nth-of-type(1)');
var tekst2 = document.querySelector('.uitslag > div:nth-of-type(2)');
var tekst3 = document.querySelector('.uitslag > div:nth-of-type(3)');
var tekst4 = document.querySelector('.uitslag > div:nth-of-type(4)');
var tekst5 = document.querySelector('.uitslag > div:nth-of-type(5)');

//Met deze if else statement laten we zien wie de partner van de gebruiker is.
if (persoon == 'Shuri') {
    tekst1.classList.remove('.ShuriPartner');

} else if (persoon == 'Rocket') {
    tekst2.classList.remove('.RocketPartner');

} else if (persoon == 'Thor') {
    tekst3.classList.remove('.ThorPartner');

} else if (persoon == 'Winter Soldier') {
    tekst4.classList.remove('.WinterSoldierPartner');

} else if (persoon == 'Hulk') {
    tekst5.classList.remove('.HulkPartner');

} }

document.querySelector('#quiz').addEventListener('submit', jouwPartner);

This is my CSS

.ShuriPartner {
display: none;}

.RocketPartner {
display: none;}

.ThorPartner {
display: none;}

.WinterSoldierPartner {
display: none;}

.HulkPartner {
display: none;}

Answer 1

Class names have no dot before them (that's a CSS selector):

// No such class
tekst1.classList.remove('.ShuriPartner');

// Correct
tekst1.classList.remove('ShuriPartner');