撤回我的信息从SQL使用ajax&js，不知道什么's错了

我正在做一个chrome扩展(freshment)，有一个小问题。
我有一个按钮，我想当按钮被点击，显示我的信息从我的数据库在我的扩展页。

HTML:

<button class="button" id="show" style="vertical-align:middle" onclick="myAjax()"><span>Show my purchaes</span></button>
<div id="showhere"> 
    //this is where i want to show the info
</div> 

Java Script:

$(document).ready(function(){
    function myAjax() {
        $.ajax({
            url:"http://127.0.0.1/show.php",
            data:{ action:'showhere' },
            method:"POST",
            success:function(data) {
                ('#showhere').html(data);
            }
        });
    }
}); 

PHP:

<?php
    if($_POST['action'] == 'showhere') {
        $servername = "localhost";
        $username = "root";
        $password = "********";
        $dbname = "test";
        // Create connection
        $conn = new mysqli($servername, $username, $password, $dbname);
        // Check connection
        if ($conn->connect_error) {
            die("Connection failed: " . $conn->connect_error);
        } 
        $sql = "SELECT ProductName, Amount, Date, WebStore FROM budget";
        $result = $conn->query($sql);

        if ($result->num_rows > 0) {
            echo "<table><tr><th>ID</th><th>Name</th></tr>";
            // output data of each row
            while($row = $result->fetch_assoc()) {
                echo "<tr><td>".$row["ProductName"]."</td><td>".$row["Amount"]."</td><td>".$row["Date"]."</td><td>".$row["WebStore"]."</td></tr>";
            }
            echo "</table>";
        } else {
            echo "0 results";
        }
        $conn->close();
    }
?>

我想要它做的很简单:我有一个按钮，下面我有一个div叫做:"showhere"，在这个div中我想把mysql信息写下来。我没有写出确切的问题，问题是按钮不做任何事情。

再来一次，谢谢!

$(document).ready(function() {
  $('#show').on('click', function(e) {
    e.preventDefault();
    $.ajax({
      url: "http://127.0.0.1/show.php",
      data: {
        action: 'showhere'
      },
      method: "POST",
      success: function(data) {
        ('#showhere').html(data);
      }
    });
  });
});