<div id='p1'>
      <p>hello world</p>
      <button id='btn1jquery'>Toggle Class with jQuery</button>
      <button id='btn1dom'>Toggle class with DOM</button>
    </div>
.alt { background: brown; color: white; }
// Using jQuery
$('#btn1jquery').on('click', () => {
  $('#p1').toggleClass('alt');
});

document.querySelector('#btn1dom').addEventListener('click', () => {
  document.querySelector('#p1').classList.toggle('alt');
});

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js