从jQuery中的网格视图HTML获取文本以应用CSS

Question

I have a asp.net datagrid whose HTML is rendered as below in browser.

<div id="divViewAlldealers" class="">
   <table id="ctl00_cph1_ucMS_grdAllDealers" cellspacing="0" border="1" style="border-collapse:collapse;" rules="all">
     <tbody>
        <tr>
           <td style="background-color: rgb(232, 246, 211);">25 - Vickar Community Chevrolet Ltd</td>
        </tr>
        <tr>
           <td>0 - Jim Gauthier Chevrolet Ltd.</td>
        </tr>
        <tr>
            <td>0 - Murray Chevrolet Ltd.</td>
        </tr>
        <tr>
            <td>0 - Birchwood Chevrolet Buick GMC Ltd.</td>
        </tr>
  </tbody>

Now my goal is I have to give diff background color to the td that is having current customer.

I know who is the current customer, but how can I find out the customer from grid?

Suppose say - Murray Chevrolet Ltd. Note: the list is dynamic and the current customer can come in any place not just as second td.

I know we can achieve it by using jQuery each() . Is it possible to fix it in jQuery without using each() function?

Answer 1

See this fiddle. If you current user is Murray, you can filter all the TD which contains 'Murray' as text and apply back ground color

$("tr td:contains('Murray')").each(function(){
  $(this).css("background-color"," rgb(232, 246, 211)");
});

http://jsfiddle.net/KSxLy/

UPDATE

$("tr td").filter(function(){
    return $(this).text() === 'San Sarif';
}).css("background-color"," rgb(232, 246, 211)");

JSFIDDLE

Answer 2

Better you do add one data attribute to the td which show it as a current customer. and than work your jQuery selector to change the background-color.

  <table id="ctl00_cph1_ucMS_grdAllDealers" cellspacing="0" border="1" style="border-   collapse:collapse;" rules="all">
 <tbody>
    <tr>
       <td data-currrentCustomer="true">25 - Vickar Community Chevrolet Ltd</td>
    </tr>
    <tr>
       <td>0 - Jim Gauthier Chevrolet Ltd.</td>
    </tr>
    <tr>
        <td>0 - Murray Chevrolet Ltd.</td>
    </tr>
    <tr>
        <td>0 - Birchwood Chevrolet Buick GMC Ltd.</td>
    </tr>
</tbody>
</table>

jQuery

$(document).ready(function(){
    $("td[data-currrentCustomer='true']").css({"background-color":"rgb(232, 246,211)"});
});

You can check my Fiddle

Answer 3

You can use the following line of code if you have the current customer name.

var custName ="Vickar";
$( "td:contains('"+ custName +"')" ).css( "color", "#FF0000" );