Как добавлять и удалять класс по клику (jQuery)?

var elementButton = document.querySelector('button'), 
    elementSquare = document.querySelector('.square'); 
 
elementButton.onclick = function() { 
    elementSquare.classList.toggle('circle'); 
}

body{ 
  padding-top: 45px; 
} 
.square { 
    margin: 25px auto; 
    height: 100px; 
    width: 100px; 
    background: #ccc; 
    transition: .3s; 
} 
 
.circle {     
    border-radius: 50%; 
} 
 
button{ 
  padding: 15px 45px; 
  font-size: 20px; 
}

<button>Button</button> 
 
<div class="square"></div>