I have a code which extracts data from database and display the data list using jQuery. I want a little modification in my code, i.e. if I click a table header it should toggle the list in ascending order and descending order.

The given below is my php code.

```
<html>
 <head>
  <link rel="stylesheet" href="bootstrap/bootstrap-4.0.0-alpha.6-dist/css/bootstrap.min.css">
  <script src="bootstrap/jquery-3.1.1.min.js"></script>
  <script src="bootstrap/bootstrap-4.0.0-alpha.6-dist/js/bootstrap.min.js"></script>
 </head>
<body>
 <div class="container">
 </div>
  <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
  <script id="source" language="javascript" type="text/javascript">
   $('#output').append("<br /><h3><center>Employee Table</center></h3>");
  // function explode(){
   $('#output').append("<input type='hidden' id='sort' value='asc'>");
    var html = "<br /><h1><center><b>Employee Table</b></center></h1>";
    $.ajax({                                      
     url: 'test2db.php', data: "", dataType: 'json', success: function(rows)       
      {
        html+= "<div class='table-responsive'>";
        html+= "<table  class='table table-bordered table-striped'>";
        html+=  "<tr>" +
                  "<th>Employee Id</th>" +
                  "<th>Employee Name</th>" +
                  "<th>Email</th>" +
                  "<th>Message</th>" +
                  "<th>Date</th>" +
                "</tr>"
        for (var i in rows)
         {
          var row = rows[i];
          var employee_id = row[0];
          var employee_name = row[1];
          var email = row[2];
          var message = row[3];
          var date = row[4];
          html+= "<tr>" +
                    "<td width='25%'>" + employee_id + "</td>" +
                    "<td width='25%'>" + employee_name + "</td>" +
                    "<td width='25%'>" + email + "</td>" +
                    "<td width='25%'>" + message + "</td>" +
                    "<td width='25%'>" + date + "</td>" +
                 "</tr>";                  
         }
        html+= "</table>";
        html+= "</div>";
        $(".container").html(html);
      }
     });
</script>
</body>
</html>

```

The given below is my data extraction code

```
<?php 
  mysql_connect("localhost", "root", "password") || die(mysql_error());
  mysql_select_db("emp") || die(mysql_error());
  $result = mysql_query("SELECT * FROM employee ORDER BY id DESC LIMIT 5");
  $data = array();
  while ( $row = mysql_fetch_row($result) )
   {
    $data[] = $row;
   }
  echo json_encode( $data );
?>

```