Apply CSS style to a row of an html table depending on a value

With jQuery it can be as short as:

$("table td:last-child:contains(NO)").parents("tr").css("background-color", "red");

That is:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
$(function() {
  $("table td:last-child:contains(NO)")
    .parents("tr")
    .css("background-color", "red");
});
</script>
<table>
  <tr>
    <td>ID</td>
    <td>DESCRIPCION</td>
    <td>ESTADO</td>
  </tr>
  <tr>
    <td>1</td>
    <td>DESCRIPCION 1</td>
    <td>SI</td>
  </tr>
  <tr>
    <td>2</td>
    <td>DESCRIPCION 2</td>
    <td>NO</td>
  </tr>
</table>

You can use the each function of jQuery to scroll through all td of the table, and if it has the value of No , you add the parent ( tr ) of that ( td ) a class , so you can understand it better and here is an example:

We have the following CSS class that we will apply with the script:

.no {
  background: red;
}

We have the following table :

<table>
  <tr>
    <th>Company</th>
    <th>Contact</th>
    <th>Yes/No</th>
  </tr>
  <tr>
    <td>Alfreds Futterkiste</td>
    <td>Maria Anders</td>
    <td>Yes</td>
  </tr>
  <tr>
    <td>Centro comercial Moctezuma</td>
    <td>Francisco Chang</td>
    <td>Yes</td>
  </tr>
  <tr>
    <td>Ernst Handel</td>
    <td>Roland Mendel</td>
    <td>No</td>
  </tr>
  <tr>
    <td>Island Trading</td>
    <td>Helen Bennett</td>
    <td>No</td>
  </tr>
  <tr>
    <td>Laughing Bacchus Winecellars</td>
    <td>Yoshi Tannamuri</td>
    <td>Yes</td>
  </tr>
  <tr>
    <td>Magazzini Alimentari Riuniti</td>
    <td>Giovanni Rovelli</td>
    <td>Yes</td>
  </tr>
</table>

And with the following script using jQuery you can get what you want:

$("td").each(function() {
    var value = this.innerHTML;
    if (/no/.test(value)) {
        $(this).parent('tr').addClass('no');
    } 
});

As you can see in the code I used a simple regular expression , this is not strictly necessary, but if the value of not was written by the user some would put < strong> NO , other No , etc.

  

Keep in mind that this will affect all the tables, if you want   only affects a certain table with a certain ID simply   You change the jQuery selector like this: $("#id_tabla td")

     

And remember to add the jQuery library: <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

I hope it helps you

They proposed solutions with Jquery better than my answer, so I will propose a solution, only with Javascript :

const filas = document.getElementById('mitabla').querySelectorAll('tbody tr');
    filas.forEach(function(valor, indice, array){
	if(valor.querySelector('td:last-child').innerText =='no') 
            valor.style.background= '#ccc';
    });

<table id="mitabla">
<thead>
	<tr>
		<th>ID</th>
		<th>Estado</th>
	</tr>
</thead>
<tbody>
	<tr>
		<td>Name1</td>
		<td>si</td>
	</tr>
	<tr>
		<td>Name1</td>
		<td>no</td>
	</tr>
</tbody>
</table>