How to simulate a click to open a tab after auto scroll - jscript

Question

I have a problem , i have a script for mobile version of page that will scroll down the page to a specific div tag, it works fine but I would like the script to also open this section (open a tab)
This is what i got so far
The script
<asp:PlaceHolder ID="plhAnimatedScroll" visible="false" runat="server">
<script type="text/javascript">
var navHeight = $('#gecko-sub-navigation').outerHeight();
var buffer = (navHeight * 2) + 70;
$("html, body").animate({ scrollTop: $('#' + '<%=SelectedPage%>').offset().top - buffer }, 1000);
</script>
</asp:PlaceHolder>
One of the sections of the page
<section class="help_section">
Box title
<div class="help_details">
<div class="help_btm_msg"> some text </div>
</div>
</section>
The opening of the tab is triggered by click on anchor tag so the class changes from class="link help_switch closed" to class="link help_switch open" , is there any way to adjust the script so that it will change the class from closed to open or emulate the click ?
Thanks

Answer 1

Since you are using jquery, you can simulate a mouseclick, or trigger a click on a certain element using the trigger function.
jQuery documentation:
.trigger()
The idea is that you can first setup a click handler, and then call that click handler any time by triggering the "click" function in your code:
$( ".help_switch" ).on( "click", function() {
alert("help_switch has been clicked, or triggered.");
// now toggle the open/closed class
var isOpen = !$(this).hasClass("closed");
if(isOpen){
$(this).removeClass("open");
$(this).addClass("closed");
} else {
$(this).removeClass("closed");
$(this).addClass("open");
}
});
// trigger the "click" event on .help_switch when the page loads
// to show an example of how to call it:
$( ".help_switch" ).trigger( "click" );
Hope this helps.
You can see a working example of this code on jsfiddle: http://jsfiddle.net/8cvkm7y3/3/, if you load this code in jsfiddle, then you can watch how the closed and open class toggles on your help_switch class as you click the "Box Title" link by "Inspect Element" in Chrome Developer Tools or your web inspector of choice.