SO - 20995526

by Arun P Johny

HTML

<table border="1">
    <tr>
        <td>Row 1</td>
        <td><a class="sam" href="#">Delete</a>
        </td>
    </tr>
    <tr>
        <td>Row 2</td>
        <td><a class="sams" href="#">Delete</a>
        </td>
    </tr>
    <tr>
        <td>Row 3</td>
        <td><a class="sam" href="#">Delete</a>
        </td>
    </tr>
    <tr>
        <td>Row 4</td>
        <td><a class="sams" href="#">Delete</a>
        </td>
    </tr>
    <tr>
        <td>Row 5</td>
        <td><a class="sam" href="#">Delete</a>
        </td>
    </tr>
</table>

CSS

.sam {
    background-color:#FF00FF;
}
.sams {
    background-color:#0000FF;
}

JavaScript

$(function () {
    update_rows();
    $("a").click(function () {
        $(this).parent().parent().remove();
        update_rows();
    });
});

function update_rows() {
    $("tr:even").css("background-color", "#aaa").find('a').removeClass('sam').addClass('sams');
    $("tr:odd").css("background-color", "#eee").find('a').removeClass('sams').addClass('sam');
}