emoji one area

getText error

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="https://rawgit.com/mervick/emojionearea/master/dist/emojionearea.js"></script>
<link rel="stylesheet" href="https://rawgit.com/mervick/emojionearea/master/dist/emojionearea.min.css">
  <textarea id="sendMessage"> </textarea>
  <p id="myButton" role="img" onclick='$("#picker").toggle()'>&#x1F642</p>
  <emoji-picker id="picker"> </emoji-picker>

CSS

textarea#sendMessage {
    height:50px;
    width: calc(100vw - 15px);
    position: absolute;
    bottom: 16px;
    resize: none;
    border: none;
    font-size: 13px;
    padding: 5px 5px 5px 10px;
    border: solid 5px
}

#myButton {
      position: absolute;
      bottom: 10px;
      right: 5px;      
      margin-left: 60px;

    }