Bootstrap Tabs Doesn't Work With Different Class Name

Bootstrap works fine in my js if I have $('.tabs').tabs(); But if I change that to something like $('.usertabs').tabs(); and also change the corresponding ul it doesn't work.

Solution 1:

$('.usertabs').tabs('.usertabs li > a'); 

should work assuming your code looks something like

<ulclass="usertabs"data-tabs="tabs" ><liclass="active"><ahref="#home">Home</a></li><li><ahref="#menu1">menu1</a></li><li><ahref="#menu2">menu2</a></li><li><ahref="#menu3">menu3</a></li></ul>

..the reason it works is if you look at bootstrap-tabs.js v1.4.0 line 70 you'll see that the $.fn.tabs plugin/function takes in a selector as its parameter.

Btw, i think the data-tabs="tabs" is unnecessary at this point.