Dialog van jQuery gebruiken op meerdere posities in script

Hallo allemaal,

Ik zit met het volgende probleem:

op de pagina http://www.podiumspektakel.eu/x.php wordt een tabel met inhoud getoond. De inhoud wordt uit een tabel opgebouwd.
Nu wil ik dat als men op een datum met * klikt, er een dialoogbox wordt geopend.
Dat lukt mij wel op de eerste regel maar op de volgende regels wordt er geen dialog geopend.
Verder wil ik de tekst laten afhangen van het item waarop geklikt wordt.
Ik heb de routine afgehaald van de pagina http://jqueryui.com/dialog/#animated.

Wie kan wil mij verder helpen?

Code in de head

<!-- Open een nieuw venster -->
    <title>jQuery UI Dialog - Animation</title>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.11.2/themes/smoothness/jquery-ui.css">
  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.11.2/jquery-ui.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css">
  <script>
  $(function() {
    $( "#dialog" ).dialog({
      autoOpen: false,
      show: {
        effect: "blind",
        duration: 1000
      },
      hide: {
        effect: "explode",
        duration: 1000
      }
    });
 
    $( "#opener" ).click(function() {
      $( "#dialog" ).dialog( "open" );
    });
  });
  </script>

Code in html

<div id="dialog" title="Basic dialog">
  <p>This is an animated dialog which is useful for displaying information. The dialog window can be moved, resized and closed with the 'x' icon.</p>
</div>

<tr>
   <td style="color: black;"><?php echo nederlandse_datum($rowRooster['datum']) ; ?></td>
   <td class="midden" title="<?php echo $rowRooster['opm1'] ; ?>" onclick= "<?php echo $cLink1 ; ?>" style="<?php echo $cStyle1 ; ?> color: white; background-color: <?php echo $rowRooster['kleur1'] ; ?>;"><?php echo $rowRooster['tijd1'] ; ?></td>
   <td class="midden" title="<?php echo $rowRooster['opm2'] ; ?>" onclick= "<?php echo $cLink2 ; ?>" style="<?php echo $cStyle2 ; ?> color: white; background-color: <?php echo $rowRooster['kleur2'] ; ?>;"><?php echo $rowRooster['tijd2'] ; ?></td>
   <td class="midden" title="<?php echo $rowRooster['opm3'] ; ?>" style="<?php echo $cStyle3 ; ?> color: white; background-color: <?php echo $rowRooster['kleur3'] ; ?>;"><div id="opener"><?php echo $rowRooster['tijd3'] ; ?></div></td>
   <td class="midden" title="<?php echo $rowRooster['opm4'] ; ?>" onclick= "<?php echo $cLink4 ; ?>" style="<?php echo $cStyle4 ; ?> color: white; background-color: <?php echo $rowRooster['kleur4'] ; ?>;"><?php echo $rowRooster['tijd4'] ; ?></td>
</tr>

Voor het gemak en het onderzoek heb ik alleen de derde kolom (die van de Cast) gebruikt


George