How to change a specific div in a loop

[John Wall]

I'm trying to create a program where the user clicks on the first name in the table and the name hides and the word "delete" appears. My problem is the word "delete" only appears in the first row of first name. I want it to appear in the second row of first name if it was click, I want it to appear in the third row of first name if it was click, and etc.

the div tags and table are within php to connect to my database

<?php
	mysql_connect("******","****","****");
	mysql_select_db("****");

	$phonequery = "select * from phonebook";
	$phoneresults = mysql_query( $phonequery );

	echo "<div id=\"phonelist\">\n";
	for( $i = 0; $i < mysql_num_rows( $phoneresults ); $i++ )
	{
		$phonerow = mysql_fetch_array( $phoneresults );
		echo "<tr class=\"colhead\">\n";
		echo "<td>".$phonerow["idnum"]."</td>\n";
		[B]echo "<td>". "<div id=\"deletename\">\n". "<a href=\"javascript:void(0);\" class=\"link\" id=\"id_". $phonerow['idnum'] ."\">". $phonerow['firstname']."</a>". "</div>". "<div id=\"appear\" style=\"display:none;\">\n". "</div>". "</td>\n";[/B]
		echo "<td>".$phonerow['lastname']."</td>\n";
		echo "<td>".$phonerow['streetaddress']."</td>\n";
		echo "<td>".$phonerow['city']."</td>\n";
		echo "<td>".$phonerow['state']."</td>\n";
		echo "<td>".$phonerow['zip']."</td>\n";
		echo "<td>". "<a href=mailto:".$phonerow['email'].">" .$phonerow['email']."</a>"."</td>\n";
		echo "<td>".$phonerow['dateadded']."</td>\n";
		echo "<td>".$phonerow['friendlevel']."</td>\n";
	}
	echo "</div>";
	?>

and this is the ajax that will have delete appear and the first name disappear

$("document").ready( function() {

	$(".link").click( function() {
		var del = $(this).attr("id").substring(3);
		$.ajax( {
			url: "deletebook_ajax.php",
			type: "POST",
			data: "del=" + del,
			success: function(msg) {
				
				$("#appear").html( msg );
				$("#deletename").hide();
				$("#appear").show('explode');
			}
		} );
		
	} );

} );

[JKing]

You are using an ID for your div. IDs should only occur once per page. Jquery finds the first ID and doesn't search for any others.

Using a class may not work much better either though as it may apply it to all of the rows. A solution might be to append a number on the end of each id to make them unique.