jquery - Changing css via JavaScript conditional not working -

i trying modify css of class depending on url. here non-working code:

js:

<script> //<![cdata[  if (location.pathname == "/searchresults.asp"  || location.pathname.indexof("-s/") != -1  || location.pathname.indexof("_s/") != -1)  $('.colors_productname span').css("background-color", "#f7f7f7"); //]]>  </script> 

html:

<div>     <a href="#" class=     "productnamecolor colors_productname" title="cracked pepper"><span itemprop=     'name'>cracked pepper</span></a><br />     <div>     <div>       <b><font class="pricecolor colors_productprice"><span class=       "pagetext_l483n">$11.00</span></font></b>     </div>     <img src="#" /></div> </div>  

notes:

1. i can't change html, automatically generated

2. the url of html includes "/meats-s/", should targeted second if conditional.

3. i can edit same css selector (.colors_productname span) in normal .css file, not work.

encase code in dom ready handler

$(function() {     // code }); 

encasing code in above handler make sure code runs after elements available in dom.

and faster use === instead of == .

also seem using window.location multiple times. consider caching it.

$(function() {    var loc = location.pathname;    if (loc === "/searchresults.asp" || loc.indexof("-s/") !== -1                                     || loc.indexof("_s/") !== -1    $('.colors_productname span').css("background-color", "#f7f7f7"); });