Sliding Up divs in jquery

Question

I have following divs

<div class="OffersContainer">
    <div class='special'>A</div>
    <div class='notspecial'>B</div>
    <div class='notspecial'>C</div>
    <div class='notspecial'>D</div>
    <div class='notspecial'>E</div>
    <div class='notspecial'>E</div>
    <span>Show more</span>
</div>

And on click of span, I want to slide Up so that only the first 3 divs having class 'notspecial' are visible. I tried the following code but it slides up in wrong order

$(offers).filter("div.notspecial:lt(4)").slideUp();

Answer 1

$(".OffersContainer > span").on("click", function(){
  $(".special, .notspecial:gt(2)").slideUp();
});//

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class="OffersContainer">
    <div class='special'>A</div>
    <div class='notspecial'>B</div>
    <div class='notspecial'>C</div>
    <div class='notspecial'>D</div>
    <div class='notspecial'>E</div>
    <div class='notspecial'>E</div>
    <span>Show more</span>
</div>