JSFiddle - React, Tailwind, and code Playground

by Aaron Kahlhamer

HTML

<br/><br/><br/><br/>
<div class="lp-lunch-totes">
</div>
<img id="book" src="book.png" alt="" width="100" height="123"
  style="position: relative; left: 10px;" />

CSS

.lp-lunch-totes:before {
    background:blue;
    content:"";
    display:block;
    height:40px;
    width:200px;
}
.lp-lunch-totes:after {
    background:red;
    content:"";
    display:block;
    height:200px;
    width:200px;
}

JavaScript

$('.lp-lunch-totes:before').click(function() {
  $('#book').animate({
    top: '-50'
  }, 300, function() {
  });
});