Search code examples
jquerycssjquery-post

Changing the background-color on EVERY div when on is removed


I have a list of divs (div.row), which I need to update the background-color on. Currently I am via CSS setting the background color with div.row:nth-child(odd) and div.row:nth:child(even) ..

The div.row's is being removed via a click - and then it succeeds, I need it to update the entire row so it still has the different background on every second..

how can I do that?

My script is right now:

<script type="text/javascript">
$(document).ready( function() {
    $("a.delete").click(function(){
        $.ajax({
            type: "POST",
            url: "...",
            data: { this_page_id: $(this).prev().val() },
            success: function(){
                $(".success-delete").css("display","block");
            },
            async: false,
            dataType: "html"
        });
        $("#r" + $(this).prev().val()).slideUp();

        var i = 1
        $("div.row").each( function(index){
            if( i % 2 ){
                $(this).css('background-color','#ffffff');
            } else {
                $(this).css('background-color','#ececec');
            }

            i++;
        });
    });
});
</script>

Solution

  • jQuery takes tons selectors:

    $('div.row:even').css('background-color', 'white');
    $('div.row:odd').css('background-color', '#ececec');
    

    Here's a huge list: http://api.jquery.com/category/selectors/.