JSFiddle - React, Tailwind, and code Playground

HTML

<div class="form-group">
                <label>Jeux - Préférences</label>
                        <div class="checkbox">
                            <label><input type="checkbox" class="cbHs" value="">Hearthstone</label>
                            <input type="text" class="form-control teamHs" placeholder="Equipe Hearthstone">
                        </div>
                        <div class="checkbox">
                            <label><input type="checkbox" class="cbTeam" value="">League of Legends</label>
                            <input type="text" class="form-control inputTeam" placeholder="Equipe LoL">
                        </div>
                <button type="submit" class="btn btn-default">S'inscrire</button>
            </div>

CSS

.teamHs{
  display: none;
}

JavaScript

//Veuillez cliquer plusieurs fois sur la première case pour comprendre l'idée
(function($){
	function $test() {
		let $cbHearthstone = $(".cbHs");
		let $inpTeamHearthstone = $(".teamHs");
		$cbHearthstone.click(function () {
			if ($cbHearthstone.is(':checked')) {
				$inpTeamHearthstone.css("display", "flex");
			} else {
				$inpTeamHearthstone.css("display", "none");
			}
		});
	}
	$(this).click($test);
}(jQuery));