title: jQuery custom Accordion - not working in IE/ Safari / Chrome
body: <p>My script <em>should</em> expand/collapse UL elements when a corresponding <code>&lt;a&gt;</code> is clicked. It works in Firefox fine and can be viewed <a href="http://www.facebig.com/facebook-marketing/design-services/" rel="nofollow noreferrer">over here</a>.</p>
  
  <p><strong>I am loading jQuery lib first then my own examples.js which contains:</strong></p>
  
  <pre><code>function initExamples() {
    $('#examples ul').hide();
    $('#examples ul:first').show();
    $('#examples li a:first').addClass('exampleon');
    $('#examples li a').click(function(event) {
        event.preventDefault();
        var checkElement = $(this).next();
        if((checkElement.is('ul')) &amp;&amp; (checkElement.is(':visible'))) {
          return false;
          }
        if((checkElement.is('ul')) &amp;&amp; (!checkElement.is(':visible'))) {
                  $('#examples a.exampleon').removeClass('exampleon');
          $('#examples ul:visible').slideUp('normal');
          $(this).addClass('exampleon');
          checkElement.slideDown('normal');
          return false;
          }
        }
      );
    }
  $(document).ready(function() {initExamples();});
  </code></pre>
  
  <p><strong>My HTML on the other hand appears like so:</strong></p>
  
  <pre><code>&lt;ul id="examples"&gt;
          &lt;li&gt;
              &lt;a href="#"&gt;TITLE TEXT 1&lt;/a&gt;
              &lt;ul&gt;
                  &lt;li&gt;&lt;a href="#"&gt;MY CONTENT 1&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
          &lt;/li&gt;
          &lt;li&gt;
              &lt;a href="#"&gt;TITLE TEXT 2&lt;/a&gt;
              &lt;ul&gt;
                  &lt;li&gt;&lt;a href="#"&gt;MY CONTENT 2&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
          &lt;/li&gt;
          &lt;li&gt;
              &lt;a href="#"&gt;TITLE TEXT 3&lt;/a&gt;
              &lt;ul&gt;
                  &lt;li&gt;&lt;a href="#"&gt;MY CONTENT 3&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
          &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>The <code>click()</code> doesn't seem to trigger in IE/Safari/Chrome, but the initial hide/show does, it also triggers the default behaviour and links to 'mypage.html#' I've tried a <code>preventDefault();</code>, but perhaps I did it wrong.</p>
  
  <p>Any help is uber appreciated!</p>