Probleme javascript

<script type="text/javascript"><!--

function show() {


document.getElementById(suppri).style.visibility = 'visible';

}
function hide(){
document.getElementById(suppri).style.visibility = 'hidden';

}

--></script>


<style type="text/css">
#msgdiv{
background-color: #FFFBF0;
opacity:0.8;
width:300px;
height:60px;
text-align:center;
}
fieldset {

width:auto;}

#msgdiv:hover{
background-color: #EFF7FB;
opacity:0.8;
width:300px;
height:60px;
text-align:center;
}

#suppri{

visibility:hidden;
width:14px;
height:14px;
border-style:solid;
border-width:1px;

 

}



#nbr{

color:red;

}


</style>

<?php

try {

$bdd = new PDO('mysql:host=localhost;dbname=labo', 'root', '');

}

catch (Exception $e)
{
die('Erreur : ' . $e->getMessage());
}

$user = JFactory::getUser();
$idconnecte = $user->id;


$req="select * from info_messages where user_id_to=$idconnecte";
$stat=$bdd->prepare($req);
$stat->execute();


$nbr=$stat->rowcount();
echo " <fieldset><legend>messages recu :<span id='nbr'>".$nbr."</span></legend>";

 


?>
<table align="center" border="0" cellspacing="8">
<tr><th>De:</th><th>Objet</th><th>Date</th><th>contenu</th></tr>

 

<?php

 

while($data=$stat->fetch()){

$dd=$data['user_id_from'];
$stat->closeCursor();


$req1="select * from info_users where id=$dd";
$stat1=$bdd->prepare($req1);
$stat1->execute();
$data1=$stat1->fetchAll(PDO::FETCH_ASSOC);

echo "<tr><td> ".$data1[0]['username']."</td><td>".$data['subject']."</td><td>".$data['date_time']."</td><td id=msg><div onmouseover=\"javascript:show()\"  onmouseout=\"javascript:hide()\" >".$data['message']."<a href='index.php/fr/mes-messages/messages-recus?view=form&layout=edit&a_id=11&supp=true'><img id='suppri' src=/images/icons/sup.png></a></div></td></tr>";
}

 

?>
</table>

</fieldset>
{/source}