Please check my code,
CSS
.ulData li.sel {
background:#fff !important;
font-size:0.8em;
font-weight:bold;
}
JS
function switchTab(typ){
$(".ulData li").removeClass("sel");
$("#"+typ).addClass("sel");
$("."+ typ +"Options").addClass("sel");
}
HTML
<ul class="ulData">
//For Loop li
<li title="${option.id}" id="${option.key}"><span>aaaa</span></li>
</ul>
If I click on a button, I call switchTab function. In there I am adding the 'sel' class. If I am adding like,
$("li#"+typ).addClass("sel");
Then working in Firefox but non of the IE versions. please help how to apply the CSS for all the browser compatibilities.
Thanks in advance
If your id
has dots, you have to escape them (I know they may be template engine ids, but just in case)
$("#${option.key}")
will not work $("#${option\\.key}")
will work
So, to ensure dot-escping do:
function switchTab(typ){
typ = typ.replace(/\./g, "\\\\.");
//... Your normal code
}
EDIT You're missing the $(document).ready()
when calling to switchTab()
. You should have:
$(document).ready(function(){
switchTab('companySection');
});
I've edited your fiddle http://jsfiddle.net/XyyWf/2/
Hope this helps. Cheers
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.