How to update a views row class in real time clicking a Flag (ajax) link Flag allows flag toggle link to use ajax, but that does not update the row class in real time. Only the field class is changed. 
Question is how to make the row to have a class when the flag link is clicked.
In my case, its a simple common case scenario of task list and the flag toggle is used to make a task 'completed', which should make the whole row another color in real time, not after page refresh.

I got as far as this script, which doesnt yet seem to work. It adds the class .highlight_row to the row in which a flag link is clicked. The flag link has a class .unflagged before clicking.

$(document).ready(function(){ 
    $('.flag').click(function() {
       if ($(this).is("unflagged")) { //If unflagged
        $(this).closest('tr').addClass("highlight_row"); 
    } else {
        $(this).closest('tr').removeClass("highlight_row");
    }
    });                  
});


EDIT
The following code worked eventually:

(function($) {
   $(document).ready(function(){    
        $(".rules-link-set_completed").children("a").click(function() {     
            $(this).closest('tr').addClass("completed"); 
        });                  
   });
})(jQuery);
Add a javascript file to your theme, or if you're using a theme that has a template, use that.  Omega 4 has a brilliant template file with explanations on how it works and a short example.  There is also a very good tutorial on using javascript and JQuery with Drupal on Drupal.org.

Basically I would set a click event on the flag checkbox and then use the .closest() method to find the row which the checkbox is inside and add or subtract classes accordingly.