css - Is there a way to check if a div has the same class as an ancestor in jQuery? -

I am looking to dynamically highlight a tab, if it represents the current page I have :

  & lt; Style & gt; #tabs li {bg-color: white;} body.Page1 #tabs Page 1, body.Page2 #tabs .Page2, body.Page3 #tabs .Page3 {bg-color: orange;} & lt; / Style & gt; & Lt; Body class = "page 1 editable class" & gt; & Lt; Ul id = "tab" & gt; & Lt; Li class = "page 1 some class" & gt; & Lt; Li class = "page 2 some other class" & gt; & Lt; Li class = "page 3 other class" & gt; & Lt; / Ul & gt; & Lt; / Body & gt; As you can see, each tab requires a CSS, so any other page includes modifying both HTML and CSS. 
 
  
  & lt; Script & gt; $ (Document) .ready (function () {var classRE = / page \ d + / i; var Page type = $ ('body'). Attr ('className'). Match (classre); $ ('li '+ PageType) .addClass (' Highlight ');}); & Lt; / Script & gt; & Lt; Style & gt; #tabs li {bg-color: white;} #tabs li.Highlight {bg-color: orange;}  
 
 How about two common classes being "highlight" and "normal"? 
   & lt; Style & gt; #tabs li {bg-color: white;} body.Page1 #tabs Page 1, body.Page2 #tabs .Page2, body.Page3 #tabs .Page3 {bg-color: orange;} & lt; / Style & gt; & Lt; Body class = "page 1 editable class" & gt; & Lt; Ul id = "tab" & gt; & Lt; Li class = "highlight" & gt; & Lt; Li class = "normal" & gt; & Lt; Li class = "normal" & gt; & Lt; / Ul & gt; & Lt; / Body & gt;