Passing toggle state - Local storage

Passing toggle state - Local storage

Hi folks!

First of all, i apologize if i am posting in wrong forum, but i am JS and jQuery newbie and i dont know what i am doing.Here is a thing.
I have a toggle open/close DIV with UL list in it that look like this: 

  1. <div id="dropdown-1"> <div class="option-heading"> <i class="fa fa-angle-double-up"></i> <i class="fa fa-angle-double-down"></i> <h5>Title</h5> </div> <div class="option-content"> <ul class="check_list check_list_show"> <li><a href="#>Item 1</a><li/> <li><a href="#>Item 2</a><li/> <li><a href="#>Item 3</a><li/> </ul> </div> </div>
And a JS code that looks like this: 
<script> $(document).ready(function() { $(".option-content").hide(); $(".fa-angle-double-up").hide(); $(".option-heading").click(function(){ $(this).next(".option-content").slideToggle(500); $(this).find(".fa-angle-double-up, .fa-angle-double-down").toggle(); }); }); </script>

Once user selects a link from that list, the same page refresh and a results are displayed on it. But, that DIV gets automatically closed and i would need it to stay open.

I am not a JS developer and i dont have any ideas on how to pass the open state of this after a refresh.Any suggestion would be greatly appreciated!

Somebody told me to use local storage for this, but i dont know what to do :(

Fiddle: http://jsfiddle.net/bumL495j/