title: Display Text of Active Element on Load and Remember
body: <p>I am currently using cookie value to switch between style rules. The issue is the text element <code>.style-value</code> only shows the active <code>a href</code> on <code>onclick</code> event. I want this to show on <code>onload</code> event too but can't get it to work no matter how much time I've spent on it. What am I missing?</p>
  
  <p>I've gotten this far:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$('#style-switcher a').click(function() {
    $('.style-value').text($(this).text());
  });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;!-- style switcher --&gt;
  &lt;link rel="stylesheet" id="switch_style" href="#"&gt;
  &lt;div class="main-parent-style-switcher"&gt;
  
    &lt;div class="style-switcher dropdown select-change"&gt;
      &lt;a class="dropdown-toggle" data-toggle="dropdown"&gt;
        &lt;span class="dropdown-label hidden-sm hidden-xs"&gt;Theme: &lt;/span&gt;
        &lt;span class="style-value"&gt;&lt;/span&gt;
        &lt;span class="caret"&gt;&lt;/span&gt;
      &lt;/a&gt;
      &lt;ul id="style-switcher" class="dropdown-menu"&gt;
        &lt;li class="style-choice"&gt;&lt;a class="default" onclick="setActiveStyleSheet('default'); return false;" href="#"&gt;Default&lt;/a&gt;
        &lt;/li&gt;
        &lt;li class="style-choice"&gt;&lt;a class="schwifty" onclick="setActiveStyleSheet('schwifty'); return false;" href="#"&gt;Get 
       Schwifty&lt;/a&gt;&lt;/li&gt;
      &lt;/ul&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  &lt;!-- /style switcher --&gt;</code></pre>
  </div>
  </div>
  </p>