I have been trying to get firefox to slide this <dd> all day.. when you click on the <dl> that encapsulates the Calendar text it is suppose to slide the <dd> under it (where the calendar is held) up. It works in IE but not in firefox.. if i alert a .html() instead of doing a .slideToggle() in IE it will give me calendar table.. but in firefox it returns null.. any ideas?
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title></title> <style type="text/css" media="screen">@import "styles.css";</style> <style type="text/css" media="screen">@import "tabs.css";</style> <style type="text/css" media="screen">@import "content.css";</style> <script src="http://jquery.com/src/jquery.js"></script> <script> $(document).ready(function(){ $("dt dl").click(function(){ $(this).parent().parent().children("#sidewidget- bottom").slideToggle(400); if($(this).children("dd").children("a").text() == "-") $(this).children("dd").children("a").text("+").fadeIn("slow"); else $(this).children("dd").children("a").text("-").fadeIn("slow"); return false; }); }); </script> </head> <body> <h1 class="logo"></h1> <ul id="maintab" class="maintabs"> <li class="selected"><a href="#">Quickboard</a></li> <li><a href="#">Classes</a></li> <li><a href="#">Website Manager</a></li> </ul> <div class="tabcontentstyle"> <ul id="maintab" class="secondarytabs"> <li><a href="#">Quickboard</a></li> <li><a href="#">Classes</a></li> <li><a href="#">Website Manager</a></li> </ul> </div> <table class="contenttable"> <tr> <td> <dl class="side-widget"> <dt id="side-widget-title" class="sidewidget-top"> <dl class="side-bar-title"> <dt><a href="#">Calendar</a></dt> <dd><a href="#">-<br clear="left"></a></dd> </dl> </dt> <dd id="sidewidget-bottom"> <table class="calendar"> <thead> <tr> <th id="calendar-previous"><a href="#" title="Previous Month">«</a></th> <th colspan="5">June 2007</th> <th id="calendar-next"><a href="#" title="Next Month">»</a></th> </tr> <tr class="weekdays"> <td>Su</td><td>Mo</td><td>Tu</td><td>We</td><td>Th</td><td>Fr</ td><td>Sa</td> </tr> </thead> <tbody> <tr><td></td><td></td><td></td><td></td><td></td><td>1</ td><td>2</td></tr> <tr><td>3</td><td>4</td><td>5</td><td>6</td><td>7</ td><td>8</td><td>9</td></tr> <tr><td>10</td><td>11</td><td>12</td><td>13</td><td>14</ td><td>15</td><td>16</td></tr> <tr><td>17</td><td>18</td><td>19</td><td class="calendartoday">20</td><td>21</td><td>22</td><td>23</td></tr> <tr><td>24</td><td>25</td><td>26</td><td>27</td><td>28</ td><td>29</td><td>30</td></tr> </tbody> </table> </dd> </dl> <dl class="side-widget"> <dt class="sidewidget-top"> <dl class="side-bar-title"> <dt><a href="#">Google Search</a></dt> <dd><a href="#">-<br clear="left"></a></dd> </dl> </dt> <dd class="sidewidget-bottom"> test </dd> </dl> </td> </tr> </table> </body> </html>