slideToggle() : problem with toggle state

slideToggle() : problem with toggle state

Hi,
I want to just replace text in <span> on another div's slideToggle(), I have written some code which I expect to execute, but it's not working.
In slideToggle() function I am getting false from is(:hidden) on both the State of slideToggle

Following is my html code:
  1. <div style="width:77%; float:left;">
  2.       <span id="addareas" class="OtherLinkStyle" style="font-size:14px;">
  3.       Show apartment area details
  4.       </span>
  5. </div>
    <div class="RoundPanel" style="float:left; width:77%;margin: 5px 0 0  0;position:relative;display:none;">
  6.       <div id="ApartmentAreaDetails" style="width: 99%; float: left; padding-left: 10px;">
  7.       //some content here
  8.       </div>   
          <div style="display:none; position:absolute; bottom:5px; right:5px;" class="btnsave">
                <input type="submit" value="Save" name="btnSave" class="linkSave"/>
                <input type="submit" value="Cancel" name="btnCancel" class="linkCancel"/>
          </div>
    </div>




and following is my jquery code:
  1.  $('#addareas').click(function () {
                $(this).parent().next(".RoundPanel").slideToggle('fast');          
                if ($(this).parent().next(".RoundPanel").is(":hidden") == true) {
                    $(this).html('Show apartments area details');
                }
                else {
                    $(this).html('Hide apartments area details');
                }
            });







Is I am doing anything wrong or missing anything here?