Question

Im not sure why this isn’t working, and with my limited jquery abilities I havent been able to located the source of the issue. The script below removes everything instead of just the parent element.

Id appreciate some help with this.

Thanks, Lea

Script:

    // Delete post
    $('a.delete').livequery("click", function(e){

    if(confirm('Are you sure you want to delete this post?')==false)

    return false;

    e.preventDefault();

    var parent  = $('a.delete').parent();

    var temp    = parent.attr('id').replace('record-','');

    var main_tr = $('#'+temp).parent();

        $.ajax({

            type: 'get',

            url: 'delete.php?id='+ parent.attr('id').replace('record-',''),

            data: '',

            beforeSend: function(){

            },

            success: function(){

                parent.fadeOut(200,function(){

                    main_tr.remove();

                 });

            }

        });

    });

Markup:

<span id="posting">
<div class="friends_area" id="record-23">
       <img src="temp/user_icon.gif" style="width: 50px; height: 48px; float: left;" alt="">

           <label style="float: left;" class="name">

           <b>99Points</b>

           <em>ry ewst yewsrtg eswtg</em>

           <br clear="all">

           <span style="font-weight: normal;">
           9 minutes ago
           </span>
           <a href="javascript: void(0)" id="post_id23" class="showCommentBox">Comments</a>

           </label>
                    <a style="display: none;" href="#" class="delete"> Remove</a>

                    <br clear="all">
            <div id="CommentPosted23">
                            </div>
            <div class="commentBox" id="commentBox-23" style="display: none;" align="right">
                <img src="small.png" class="CommentImg" style="float: left;" alt="" width="40">
                <label id="record-23">
                    <textarea class="commentMark" id="commentMark-23" name="commentMark" cols="60"></textarea>
                <div>Write a comment...&nbsp;</div></label>

                <br clear="all">
                <a id="SubmitComment" class="smallbutton"> Comment</a>
            </div>
       </div>
           <div class="friends_area" id="record-22">

       <img src="temp/user_icon.gif" style="width: 50px; height: 48px; float: left;" alt="">

           <label style="float: left;" class="name">

           <b>99Points</b>

           <em>hywr ywerywersywrsey ry r</em>
           <br clear="all">

           <span style="font-weight: normal;">
           9 minutes ago
           </span>
           <a href="javascript: void(0)" id="post_id22" class="showCommentBox">Comments</a>

           </label>
                    <a style="display: none;" href="#" class="delete"> Remove</a>
                    <br clear="all">
            <div id="CommentPosted22">
                            </div>
            <div class="commentBox" id="commentBox-22" style="display: none;" align="right">
                <img src="small.png" class="CommentImg" style="float: left;" alt="" width="40">

                <label id="record-22">
                    <textarea style="overflow: hidden; color: rgb(51, 51, 51);" class="commentMark" id="commentMark-22" name="commentMark" cols="60"></textarea>
                <div style="position: absolute; display: none; font-weight: 400; width: 300px; font-family: monospace; line-height: 14px; font-size: 11px; padding: 0px;">Write a comment...&nbsp;</div></label>
                <br clear="all">
                <a id="SubmitComment" class="smallbutton"> Comment</a>
            </div>
       </div>

        <div id="bottomMoreButton">
    <a id="more_10" class="more_records" href="javascript: void(0)">Older Posts</a>
    </div>
                </span>

Answer 1

use $(this) instead of the class selector :). Right now you are removing all of the items with that class.

var parent  = $(this).parent();

Also, be wary that you cannot use $(this) in the ajax call (because it will refer to the ajax call), so you are (accidentally?) doing the right thing by storing it in a variable and the calling .remove() on it.