在一组匹配元素中的一个元素上触发单击事件，而不是在匹配元素上触发

Question

I'm trying to figure out how to find when my anchor tag is clicked, how to prevent the set of matched elements not to fire. Here is my Javascript:

//open the dialog box
$('.update').click(function (event) {
     var $target = event.target;
     if ($target == $target) {
    $('.update-form').dialog('open');
    console.log('yep');
     } else {
    console.log('nope');
     }

     return false;
});

Heres the HTML

<tbody>
    <tr>
        <th>Designer</th>
        <th>Style</th>
        <th>Color</th>
        <th>Size</th>
        <th>Detials</th>
        <th>Notes</th>
    </tr>
    <tr style="background-color: rgb(201, 201, 201); color: rgb(255, 255, 255); ">
        <td>JASZ COUTURE</td>
        <td>4210</td>
        <td>GOLD</td>
        <td>S</td>
        <td> STRAPPY STETCH COCKTAIL</td>
        <td></td>
        <td><a href="http://localhost:8888/lexsreg/index.php/#" class="update">UPDATE</a></td>

    </tr>
    <tr>
        <td>test</td>
        <td>4as451</td>
        <td>test</td>
        <td>test</td>
        <td>tes</td>
        <td>tes</td>
        <td><a href="http://localhost:8888/lexsreg/index.php/#" class="update">UPDATE</a></td>

    </tr>
</tbody>

I know that event.target is returning a value based on the index of the element with the matched set. How do I tell the other elements to not fire. Whats happens is, depending on the number of anchor tags with the class of update, will open that many modal windows. I just need one, not the whole bunch

//set the functions of the dialog box
$('.update-form').dialog({
    autoOpen: false,
    height: 300,
    width: 350,
    modal: true,
    draggable: false,
    resizable: false,
    buttons: {
        'Update': function() {
            //json will happen here
        },
        'Cancel': function() {
            $(this).dialog('close');
        }
    },
    close: function() {
        allFields.val('').removeClass('ui-state-error');
    }
});

Got a solution its ugly but it works Give the modal windows equal ids

$updateForm.each(function(index) {
    $(this).attr('id', index);
});

On click pass the event and get the current target id. Traverse the DOM tree and find the modal window whose id matches this.

//open the dialog box for the rows
$($btns).click(function(event) {
var target = event.currentTarget.id,
 form = $(this)
    .parent()
    .parent()
    .parent()
    .parent()
    .parent()
    .parent()
    .siblings()
    .children()
    .filter('#'+target);
    $(form).dialog('open');
    return false;
});

Answer 1

Instead of

if ($target == $target) {

try

if ($target == this) {

With your approach it would be true for all links which leads to multiple modals opening

Answer 2

Are you sure that since you are using a class $('.update-form').dialog('open'); you are not opening more than one dialog because there are more than one element with that class? i tested your code here and it seems to work:

http://jsfiddle.net/aMsbT/1/

EDIT - regarding your comment, to stop proapgation of the event you should use stopImmediatePropagation() , to know what part of the DOM triggers your event you should use, as you do event.target