Dialog Box from DT-DD

I have a long list of items that are in the DT / DD format. Here is my PHP

foreach($allnews as $row){
 $row->subject = ucwords($row->subject); 
echo "<dt class=\"row\">$row->date -> $row->subject </dt>";
echo "<dd class=\"show\">$row->news</dd>";
}

Here is my Jquery;

$(function(){
   $('.show').hide(); //hide the DD
   $('.row').clic开发者_运维问答k(function(){
        $('.show').dialog({
            width: 400,
            stack: false,
            height: 500               
        });    
    });      
 });

I am going to make this into a modal when I solve my problem. And my problem is this: When I click on one of my DT's I do get the dialog box (opens the DD and displays correctly). However I get the dialog box for every single item that comes out of the database. I want just the row that I click to open up into a dialog box or soon to be a modal

I know that if I use "this" it will probably select just one row. But where do I use it? I will have no problem making it into a modal, I just want to know how to choose just the row I click

thank you in advance

The selectors are global. In your click function,

$('.show').dialog(...)

will do exactly what you are seeing. Activate for all elements with the $('.show') class. Instead, you want to work within the context of the element you clicked. For example

$('.row').click(function() {
    $(this).next('.show').dialog(...);
}

This will set the currently clicked '.row' as your this element and then find the next element (sibling), confirm that it matches the '.show' selector, and then run the dialog.

JSFiddle Demonstration: http://jsfiddle.net/ayv6U/