JQUERY + CSS - Truncate Text

HTML

<section>
    <article class="truncate">
    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minima suscipit laborum nesciunt dolorem nemo quos eos perspiciatis vero quia odio neque aliquam magnam? Tempore nesciunt cumque eius architecto harum dolores.
    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minima suscipit laborum nesciunt dolorem nemo quos eos perspiciatis vero quia odio neque aliquam magnam? Tempore nesciunt cumque eius architecto harum dolores.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minima suscipit laborum nesciunt dolorem nemo quos eos perspiciatis vero quia odio neque aliquam magnam? Tempore nesciunt cumque eius architecto harum dolores.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minima suscipit laborum nesciunt dolorem nemo quos eos perspiciatis vero quia odio neque aliquam magnam? Tempore nesciunt cumque eius architecto harum dolores.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minima suscipit laborum nesciunt dolorem nemo quos eos perspiciatis vero quia odio neque aliquam magnam? Tempore nesciunt cumque eius architecto harum dolores.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minima suscipit laborum nesciunt dolorem nemo quos eos perspiciatis vero quia odio neque aliquam magnam? Tempore nesciunt cumque eius architecto harum dolores.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Minima suscipit laborum nesciunt dolorem nemo quos eos perspiciatis vero quia odio neque aliquam magnam? Tempore nesciunt cumque eius architecto harum dolores.
    </article>
    <button class="expand">Read More ⇾</button>
</section>

CSS

article {
  width: 200px;
  margin-bottom: 10px;
}

button {
  cursor: pointer;
}

.truncate {
  width: 250px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

JavaScript

$('.expand').click(function(){
    $(this).parent().find('article').toggleClass('truncate');
});