Jquery hide/show not working in Firefox/Chrome
<p>I have a bit of HTML/JQuery code that only seems to be working for IE 8.  I am attempting to embed a meebo chat widget into a wiki by adding some direct html code.  I don't want the widget to load by default, as it takes a bit of time, so I am putting it in a div and hiding it using Jquery.</p>

<p>Unfortunately, this only seems to work in Internet Explorer.  In Firefox 3, when I click on the toggle button, nothing happens.  When I tried in Google Chrome, the show/hide text would toggle, but the embedding widget doesn't show up.</p>

<p>Does anyone know if this is an issue using JQuery, or perhaps a browser compatibility issue?  There is a lot of backend wiki code that could be affecting the issue as well.  For instance, the place where I embed the widget is nested in both tables and other divs.  Could this be causing problems with the JQuery selectors?</p>

<p>Any help would be appreciated.</p>

<h2>Jquery Code:</h2>

<pre><code>$(document).ready(function(){

    $(".btn-slide").click(function(e){ 
       e.preventDefault();

       $("#meebo-panel").toggleClass("meebo-open").toggleClass("meebo-closed").toggleClass("meebo-hide").toggleClass("meebo-show");
       $(".btn-slide").toggleClass("show-text").toggleClass("hide-text");
       $(".show-hide-panel").toggleClass("green-panel").toggleClass("grey-panel");

       $(".meebo-show").show();
       $(".meebo-hide").hide();

       $(".show-text").text("Chat with me");
       $(".hide-text").text("Hide");
       return false;   
    });
});
</code></pre>

<h2>My HTML:</h2>

<pre><code>&lt;div class="show-hide-panel green-panel"&gt;&lt;a href="#" class="btn-slide show-text"&gt;Chat now&lt;/a&gt;&lt;/div&gt;
&lt;div id="meebo-panel" class="meebo-closed meebo-hide"&gt;
    Test
&lt;/div&gt;
</code></pre>

<p>EDIT: It appears that this issue occurs regardless of what is in the div.  I simplified the example to include text instead, since I believe it streamlines the code a bit.</p>
