JSFiddle - React, Tailwind, and code Playground

by Michel Penke

HTML

Hier steht Text. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam

<form action="/action_page.php">
  <label for="male">Antwort 1</label>
  <input type="radio" name="gender" id="input1" value="male"><br>
  <label for="female">Antwort 2</label>
  <input type="radio" name="gender" id="input2" value="female"><br>
  
  <div id="text1" class="text">
 Text 1 Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam
  </div>
  
  <div id="text2" class="text">
  Text 2 Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam
  </div>
</form>

CSS

.text {
  display: none;
}

#text1 {
  color: red;
}
#text2 {
  color: blue;
}

#input1:checked ~ #text1 {
  display: inline-block;
}

#input1:checked ~ #text2 {
  display: none;
}

#input2:checked ~ #text2 {
  display: inline-block;
}

#input2:checked ~ #text1 {
  display: none;
}