Warum der jQuery-Skript

Question

HTML-Code nur für die erste Zeile in einer Tabelle funktioniert:

<?php if($accountsAwaitingRow_cnt != 0): ?> 
            <?php foreach($accountsawaitingarray as $datum): ?> 
         <tr data-id="<?php echo $datum['ID']; ?>" id="rowID" href="#"> 
          <td id="userID"><?php echo $datum['ID']; ?></td> 
          <td><?php echo htmlspecialchars($datum['Account']); ?></td> 
          <td><?php echo $datum['SubmitDate']; ?></td> 
          <td><span class="label label-warning">Pending</span></td> 
          <td><?php echo htmlspecialchars($datum['Email']); ?></td> 
         </tr> 
            <?php endforeach; ?> 
          <?php else: ?> 
           <span style="color:red">*</span>There are no accounts awaiting approval, check back later. 
          <?php endif; ?> 

Script:

$("#rowID").click(function(){ 
    var User = $("#userID"); 
    var Box = $("#userBox"); 

    Box.show(); 
$("#userBox").animate({ 
    maxHeight: '+=1000px' 
}, 1000); 

$("html, body").animate({ 
    scrollTop: $(document).height() 
}, 1000); 

    $("#thisHR").show(); 
$("#thisHR").animate({ 
    maxWidth: '+=1000px' 
}, 1000); 

} 
); 

Was ich acomplish will, ist, wenn ein Administrator auf einer Zeile klickt in eine Tabelle gibt es eine Box, die erscheint und mit den Informationen des Benutzers zu erweitern, es funktioniert nur mit der ersten Zeile und ich verstehe nicht warum.

Answer 1

$ ("# rowID"). Click(); setzt den Listener auf das Element mit der ID "rowID". IDs sollten eindeutig sein, damit der Listener nur auf das erste Element mit dieser ID angewendet wird. Wenn Sie den Listener für alle Elemente festlegen möchten, sollten Sie Klassen verwenden. z.B. class = "clickable-row"