We Keep Coding

button to open specific accordion tab

i'm trying to create a button or link that opens a specific accordion tab, here is my accordion structure:
<div class="tabs">
<div class="tabs-header">
<div class="border"></div>
<ul>
<li class="active">Home</li>
LINK HERE to open Tab 2
LINK HERE to open Tab 3
<li>Symptom Checker</li>
<li>Locator</li>
</ul>
</div>
<div class="tabs-content">
<div tab-id="1" class="tab active"></div>
<div tab-id="2" class="tab"></div>
<div tab-id="3" class="tab"></div>
</div>
I'm guessing there will be a onclick event I can apply to a button? i've tried:
Symptom Checker
but nothing happens other than updating the URL

you can use
$('your_button').on('click',function(){
$( "#accordion" ).accordion( "option", "active", 1 );
});
for tab2 and
$('your_button').on('click',$( "#accordion" ).accordion( "option", "active", 2 );})
for tab3
or you can use onclick property
<a onclick="$( '#accordion' ).accordion( 'option', 'active', 1 )">Click here for tab2</a>
See a working demo here.
source http://api.jqueryui.com/accordion/#option-active

I want to make each and every link active when user clicks on it in accordion .bt i have no any idea for this.plz help me

here is a image of coding
here i have a jquery code and html code.i have external css also.i have a problem for making active feed,medicine,eggs,birds and summary item.i want also to make active every pages of sub item of given above item.
<script>
$(function() {
$( "#accordion" ).accordion({
collapsible: true,
active:false,
heightStyle:""
});
});
</script>
<div class="sidebar">
<div id="icon-bar">
<a class="active" href="startpage.php">Home</a>
<div id="accordion">
<a class="" href="#">Feed<span class="caret"></span></a>
<div id="feeditem">
<a href="feed_purchase.php" >Feed-Purchase</a>
Feed-Consumption
Feed-Stock
</div>
Medicine<span class="caret"></span>
<div id="medicineitem">
<a href="medicine_purchase.php" >Medicine-Purchase</a>
<a href="medicine_consumption.php" >Medicine-Consumption</a>
Medicine-Stock
</div>
Birds<span class="caret"></span>
<div id="birdsitem">
Birds-Purchase
Birds-Sales
Birds-Mortality
Birds-Stock
</div>
Eggs<span class="caret"> </span>
<div id="eggsitem">
Egg-Lays
Egg-Sales
Egg-Stock
</div>
Summary<span class="caret"></span>
<div id="summaryitem">
Stock-Summary
Income-Summary
Expenses-Summary
Consumption-Summary
</div>
</div>
</div>
</div>

If you using jquery-ui.js please try below css
.ui-accordion-header-active {
background-color: #FFF;
color: #0077b3;
}

The information is not so clear but as I understand you want to make thee clicked link active. You can use the script. 'active' is a css style.
<script>
$('div#accordion > a').click(function (e) {
$('div#accordion > a').removeClass('active');
$(this).addClass('active');
});
</script>

Show/hide jQuery menu click functions

I have the following code for my menu, the trouble is I want it to hide/close as soon as I click on one of the options, instead of closing at the X button:
THIS IS THE HTML
MENU
<div class="mobilenav">
<li>HOME</li>
<li>SERVICES</li>
<li>WORK</li>
<li>TALK</li>
</div>
ICON
<a href="javascript:void(0)" class="icon">
<div class="MENU">
<div class="menui top-menu"></div>
<div class="menui mid-menu"></div>
<div class="menui bottom-menu"></div>
</div>
</a>
AND JS
$(document).ready(function () {
$(".icon").click(function () {
$(".mobilenav").fadeToggle(500);
$(".top-menu").toggleClass("top-animate");
$(".mid-menu").toggleClass("mid-animate");
$(".bottom-menu").toggleClass("bottom-animate");
});

Try this:
$( ".icon" ).bind( "click", function() {
$(".mobilenav").fadeToggle(500);
$(".top-menu").toggleClass("top-animate");
$(".mid-menu").toggleClass("mid-animate");
$(".bottom-menu").toggleClass("bottom-animate");
});
This will bind the click function to the class. Also a side-note watch where you place your scripts. From personal experience I've had best results putting all js code (inline and external) right before the tag (even when using document.ready()) but this is probably just personal preference.
DOCUMENTATION FOR BIND

JavaScript Not Removing Class

I am working on a JavaScript class so when link is clicked that has a class of parent it will remove it and then add a class of .open
I have got addClass working but is not removing parent class when click on.
And when clicked closed should remove class open and revert it back to parent.
JavaScript Code
<script type="text/javascript">
$('.parent').on('click', function() {
$('.parent').addClass('.open').removeClass('.parent');
});
</script>
HTML Code
<div class="site-container">
<header id="header">
</header>
<div id="column_left" class="active">
<nav id="menu">
<ul class="nav">
<li><i class="fa fa-dashboard fa-fw"></i> <span>Dashboard</span></li>
<li><a class="parent" data-toggle="collapse" data-target="#setting"><i class="fa fa-cog"></i> <span>System</span></a>
<ul id="setting" class="nav collapse">
<li><a data-toggle="collapse" data-target="#user">Users</a>
<ul id="user" class="nav collapse">
<li>Users</li>
<li>User Group</li>
</ul>
</li>
</ul>
</li>
</ul>
</nav>
</div>
<div class="page-container">
<div class="container-fluid">
<div class="page-header">
<h1>Dashboard <small>Dashboard Stats</small></h1>
</div>
</div>
</div>
</div>

The whole idea is to toggle classes "parent" and "open" on link click.
Because of dynamical element classes it should be $(static_selector).on('click', '.parent,.open'.
JSFiddle example.
$(document).ready(function()
{
$(document).on('click', '.parent,.open', function()
{
$(this).toggleClass("parent open");
});
});

try something like this
<script type="text/javascript">
$('.parent').on('click', function() {
$(this).addClass('open').removeClass('parent');
});
</script>

You shouldn't add the period in addClass() and removeClass():
Replace:
$('.parent').addClass('.open').removeClass('.parent');
With:
$('.parent').addClass('open').removeClass('parent');
Also, it's more efficient to use $(this) instead of $('.parent') in the event listener, since this is the target of the click event. jQuery won't have to look for .parent, then.

No need to apply . as class when you add or remove class, check here
$('.parent').on('click', function() {
$('.parent').addClass('open').removeClass('parent');
});

Custom script of jQuery Tabs

I have sticky problem with jquery tabs. Below link to my website:
http://www.rask.pl/test/majatruck/wynajem-krotkoterminowy.html
Structure of divs:
<div class="cnt">
<div class="left">
<ul class="list">
<li><span class="title"><a class="tab_link tab_link_wybrany" rel="#rnt1" href="#">First</a></span></li>
<li><span class="title"><a class="tab_link" rel="#rnt2" href="#">Second</a></span></li>
<li><span class="title"><a class="tab_link" rel="#rnt3" href="#">Third</a></span></li>
</ul>
</div>
<div class="super">
<div id="rnt1" class="tab_text tab_wybrany">First</div>
<div id="rnt2" class="tab_text">Second</div>
<div id="rnt3" class="tab_text">Third</div>
</div>
</div>
Tabs script:
$(document).ready(function(){
$(".tab_wybrany").fadeIn();
$(".tab_link").live("click", function(event){
event.preventDefault();
$(".tab_link_wybrany").removeClass("tab_link_wybrany");
$(this).addClass("tab_link_wybrany");
var container_id = $(this).attr("rel");
$(".tab_wybrany").animate({
opacity : "toggle",
},function(){
$(this).removeClass("tab_wybrany");
$(container_id).addClass("tab_wybrany");
$(".tab_wybrany").animate({
opacity : "toggle",
});
});
});
});
When I click on tab - divs disapear? Offline is everything OK... I don't know where is my mistake... Please help me! :)

May i suggest instead of using animate opacity that you use fadeIn and fadeOut. That may solve your problem.
So your script would look like this:
$(document).ready(function(){
$(".tab_wybrany").fadeIn();
$(".tab_link").live("click", function(event){
event.preventDefault();
$(".tab_link_wybrany").removeClass("tab_link_wybrany");
$(this).addClass("tab_link_wybrany");
var container_id = $(this).attr("rel");
$(".tab_wybrany").fadeOut(750, function(){
$(this).removeClass("tab_wybrany");
$(container_id).addClass("tab_wybrany");
$(".tab_wybrany").fadeIn(750);
});
});
});