jquery - why this slideUp/slideDown is not working with jquery?

Question

why slideDown does not work in this code

$(".btn-more").click(function(){
                if ($(this).parent().is(".open") ) {
                    $(this).parent().prev().slideToggle(100);
                    $(this).parent().removeClass('open');
                    $(this).html("read more..");
                }
                else {
                    $(this).parent().prev().slideToggle(100);
                    $(this).parent().addClass('open');
                    $(this).html("read less..");
                }

the Html

<div id="content">
   <p>
       <span></span>
   </p>
   <span id="read-more"></span>
   <div class="more active" id="preface-more">
       <a class="btn-more" id="preface-more-btn" href="#"></a>
   </div>

what iam encountering now is the slideup works but slidedown doesn't slide just show, even though iam using slideToggle.. any advice please?

thank you..

Answer 1

请检查以下代码。
（功能（）{
    $(".btn-more").click(function(){
        //$("#read-more").toggle();你也可以使用toggle
     if($("#read-more").is(".open")) {
        $("#read-more").slideUp(100);
        $("#read-more").removeClass('open')
        $(this).html("阅读更多..");
      }别的{
        $("#read-more").addClass('open')
        $("#read-more").slideDown(100);
        $(this).html("少读..");
      }
    });
});
<div id="内容">
   <p>
       <span></span>
   </p>
   <span id="read-more" class="open">数据数据数据数据</span>
   <div class="more active" id="preface-more">
       <a class="btn-more" id="preface-more-btn" href="#">少读</a>
   </div>
</pre>