JSFiddle - React, Tailwind, and code Playground

HTML

<div id="lightA" class="white_content" height="300">
    <h1>Adivinar...</h1>
    <h2>Que personaje escoges?:</h2>
    <form type="post">
      <input type="text" list="personajes">
      <datalist id="personajes" style="display:block">
        <?php
        session_start();
        include "config.php";
        if(isset($_SESSION["user_name"]))
        {
          $select = "SELECT nombre_personaje FROM partida WHERE user_name =".$_SESSION["user_name"]."AND personaje_activo = 'T'";
          $query = mysqli_query($con, $select);
          $rows = mysqli_num_rows($query);
          $cont = 0;
          $tableval;
          if($rows > 0)
          {
            while($row = mysqli_fetch_array($query))
            {
              if($row['personaje_activo'] = "T")
              {
                =$tableval."<option value=\"".$row['']."\">";
              }
            }
          }
          else
          {
            ?>
            &nbsp;
            <?
          }
        }
        echo $tableval;
        ?>
      </datalist>
      <button type="submit" action="submit_character.php" name="select" style="display:inline">Elegir!</button>
    </form>
    <button onclick="cerrarPop('lightA')">Cancelar</button>
  </div>

JavaScript

function mostrarPop(name) {
    document.getElementById(name).style.display='block';
    document.getElementById('fade').style.display='block';
  }
  cerrarPop = function (name) {
    document.getElementById(name).style.display='none';
    document.getElementById('fade').style.display='none';
  }