使用JSON打印sql表

I want to print all sql table and show them in html table. I am new in php, JSON and AJAX. I send username successfully and get result in php. I think there is a problem in JSON part or AJAX. Can anyone help me?

index.php

<div class="col-lg-6">
  <p id="usr" style="color:gray; font-size: 48px;"></p>
  <script type="text/javascript">

      var usr = document.getElementById("dom-target");
      var username = usr.textContent;
      username = username.trim().replace(/ /g, '%20');
      document.getElementById("usr").innerHTML = username;
      var sendtophp = "username="+username;

      $.ajax({
        type: "POST",
        url: "getcoursetable.php",
        data: sendtophp,
        dataType:"json",
        success: function(response) {
          console.log(response);
          var trhtml ='';
          document.getElementById("demo").innerHTML = response;
          $.each(response, function (i, item) {
              trHTML += '<tr><td>' + item.cname + '</td><td>' + item.subject + '</td><td>' + item.course + '</td><td>'+ item.grade + '</td></tr>';
          });
          $('#results').append(trHTML);
        }
      });

  </script>
  <table id="results"></table>
</div>

getcoursetable.php

<?php
  include_once "connection.php";

  if(isset($_POST["username"])){
    $nick = $_POST["username"];

    $prep = "SELECT * FROM `enrolledtable` WHERE nickname='$nick'";

    $results = mysqli_query($con, $prep);

    $jsonData = array();
    while ($row = $results->fetch_row()) {
        $jsonData[] = $row;
    }
    echo json_encode($jsonData);
      }
 ?>

Now, I can print data but not like a table, like that

<p id="demo">denemee,CS,300,B,denemee,CS,301,B ,denemee,CS,305,B ,denemee,CS,307,B,denemee,CS,408,A-,denemee,IE,208,B ,denemee,MATH,306,B</p>

I solve my problem. This can take table in php and create html table.

index.php

<div class="col-lg-6">
  <p id="usr" style="color:gray; font-size: 48px;"></p>
  <script type="text/javascript">

      var usr = document.getElementById("dom-target");
      var username = usr.textContent;
      username = username.trim().replace(/ /g, '%20');
      document.getElementById("usr").innerHTML = username;
      var sendtophp = "username="+username;

      $.ajax({
        type: "POST",
        url: "getcoursetable.php",
        data: sendtophp,
        dataType:"json",
        success: function(response) {
          var trhtml ='';
          $.each(response, function (i, item) {
              trhtml += '<tr><td>' + item[0] + '</td><td>' + item[1] + '</td><td>'+ item[2] + '</td></tr>';
          });
          $('.append').append(trhtml);
        }
      });

  </script>
  <table id="results">

    <tr>
    <th>Name</th>
    <th>Subject</th>
    <th>Course</th>
    <th>Grade</th>
    </tr>
    <tbody class="append">

    </tbody>
    </table>
</div>

getcoursetable.php

<?php
  header('Content-Type: application/json');
      include_once "connection.php";

      if(isset($_POST["username"])){
        $nick = $_POST["username"];

        $prep = "SELECT subject,course,grade FROM `enrolledtable` WHERE nickname='$nick'";

        $results = mysqli_query($con, $prep);

        $jsonData = array();
        while ($row = $results->fetch_row()) {
            $jsonData[] = $row;
        }
        echo json_encode($jsonData);
      }
 ?>

The problem might sit around here :

      console.log(response);
      var trhtml ='';
      document.getElementById("demo").innerHTML = response;
      $.each(response, function (i, item) {
          trHTML += '<tr><td>' + item.cname + '</td><td>' + item.subject + '</td><td>' + item.course + '</td><td>'+ item.grade + '</td></tr>';
      });
      $('#results').append(trHTML);

First, JavaScript is a Case Sensitive language : trhtml and trHTML are not the same variables.

Second, if your sentence "output of php" means you reported the output of console.log(), then response look like a string to me, you must make it parsed as Json.

Moreover, I don't know what the beginning of the string denemee is but it breaks the Json notation.

your ajax function is looking for data of type json so you need to declare this at the top of getcoursetable.php

header('Content-Type: application/json');