why JS (sorting table) code doesn't work when loading the Table from PHP using Ajax

why JS (sorting table) code doesn't work when loading the Table from PHP using Ajax

Hi
I edit a simple table then sorting using JS. loading the Table in HTML docs working fine, loading from PHP doesn't work

here is my HTML code including Ajax:

<!DOCTYPE html>
<html>
<link type="text/css" rel="stylesheet" href="tbl.css" />
<script src="smartTables.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/jquery-ui.min.js"></script>
<script type="text/javascript">
var mySite = "index.php?";

function getCouponID()
{
$.ajax({
url: mySite+"func=couponSiteNo",
dataType: "html",
success: function (result) {
$("#coupons").html(result);
$.getScript("smartTables.js");
$('#coupons').listview('refresh');
}
})
}
</script>
</head>
<body>
<form name="CouponNo">
<p style='text-align:center;'>print table
<input type="button" value='GetTbl' onclick="getCouponID()" /> </p> 
</form>
<!--********REsults screen ***************-->
<!-- results table not sorting -->
      <div id="coupons" ></div>

<!-- example table sorting by JS -->
<h2 style='color:red;text-align:center;'>Example table</h2>
<table class="smartTable">
<tr>
<th></th>
<th>Cat</th>
<th>Sheep</th>
<th>mouse</th>
<th>Dog</th>
</tr><tr>
<td>Name</td>
<td>Daisy</td>
<td>Fluffy</td>
<td>Oinky</td>
<td>Barky</td>
</tr><tr>
<td>Height</td>
<td>180cm</td>
<td>121cm</td>
<td>100cm</td>
<td>056cm</td>
</tr><tr>
<td>Deliciousness</td>
<td>85%</td>
<td>68%</td>
<td>93%</td>
<td>13%</td>
</tr><tr>
<td>Noise</td>
<td>Moo</td>
<td>Baa</td>
<td>Oink</td>
<td>Woof</td>
</tr>
</table>
</body>
</html>

Php example:
<?php
header('Content-Type: text/javascript; charset=UTF-8');

$func=0; 
if (isset($_GET['func']))
{
$func=$_GET['func'];
if ($_GET['func']=='couponSiteNo')
{
getSiteByID();
}
}

function getSiteByID()
{
echo("<h1 style='color:red;text-align:center;'>Php table</h1>");

print("<script type='text/javascript'>
$.ajaxSetup ({'url: '/xmlhttp/',global: true});
</script>");
print('<script src="smartTables.js" type="text/javascript"></script>');
print('<link type="text/css" rel="stylesheet" href="tbl.css" />');
print('<table class="smartTable">
<tr>
<th></th>
<th>Cow</th>
<th>Sheep</th>
<th>Pig</th>
<th>Dog</th>
</tr><tr>
<td>Name</td>
<td>Daisy</td>
<td>Fluffy</td>
<td>Oinky</td>
<td>Barky</td>
</tr><tr>
<td>Height</td>
<td>180cm</td>
<td>121cm</td>
<td>100cm</td>
<td>056cm</td>
</tr><tr>
<td>Deliciousness</td>
<td>85%</td>
<td>68%</td>
<td>93%</td>
<td>13%</td>
</tr><tr>
<td>Noise</td>
<td>Moo</td>
<td>Baa</td>
<td>Oink</td>
<td>Woof</td>
</tr>
</table>');
}
?>