CODEWITHSUNDEEP
jquery
Ivan
Ivan

Reputation: 5248

Jquery set row background on click

I am trying to create a jquery script for my html table so that when I click on a tr row, it sets its color. I was successful doing that with .css() but I want it so that when I click again on the same row I want the color to be set back to the default value (background color).

setTableRowColor:function(status) {
        if (status == true) {
            $("table tr").click(function(){
                $(this).css('background-color','red');                      
            });                 
        };
    },

Check: http://jsfiddle.net/R5GzS

So i dont know how to set css() callback to my default color.

Upvotes: 0

Views: 80

Answers (2)

j08691
j08691

Reputation: 207901

Use a class instead and add/remove it via toggleClass():

setTableRowColor:function(status) {
    if (status == true) {
        $("table tr").click(function(){
            $(this).find('td').toggleClass('red');                      
        });                 
    };
}

jsFiddle example

Upvotes: 2

tymeJV
tymeJV

Reputation: 104775

Your best bet is to create a CSS class with the row color, then toggle the class:

$("table tr").click(function(){
    $(this).toggleClass('active');                   
}); 

.active {
    background-color: red;
}

Upvotes: 3

Related Questions