Change Row Color based on td value using Jquery

Question

I have a table that gets populated from a database. I have 2 conditions that i need to apply

1. Apply Zebra striping to the Table (Completed)
2. Change Row color to red based td value

​`

<tr class="alt">
    <td class="status"><input type="text" value="One"></td>
    <td class>Received</td>
</tr>
<tr class="alt">
    <td class="status"><input type="text" value="One"></td>
    <td class>Received</td>
</tr>
<tr class="alt">
    <td class="status"><input type="text" value="Zero"></td>
    <td class>Received</td>
</tr>
<tr class="alt">
    <td class="status"><input type="text" value="One"></td>
    <td class>Received</td>
</tr>
<tr class="alt">
    <td class="status"><input type="text" value="Zero"></td>
    <td class>Received</td>
</tr>

​`

$(document).ready(function()
{
$("tr.alt:even").css("background-color", "#f0f8ff");
$("tr.alt:odd").css("background-color", "#fcfceb");
});

$(document).ready(function() {
   $('.status.val():contains("Zero")').closest('tr.alt').css('background-color', '#cd0000');
});

I wanna change the row color based on the input value

<td class="status"><input type="text" value="One"></td>

Here is a fiddle of what I've done so far

Would appreciate the help.

Answer 1

Try this,

Live Demo

$('td.status[value=Zero]').css('background-color', 'red');

Edit: Based on comments and change in OP

To change the whole row with the given criteria of td you can do it this way.

Live Demo

$('td.status[value=Zero]').closest('tr').css('background-color', 'red');