jQuery add / remove css class example

by chris callaghan

HTML

<h1>jQuery add / remove css class example</h1>
 
  <p id="para1">This is paragraph 1</p>
  <p>This is paragraph 2</p>
  <p>This is paragraph 3</p>
  <p>This is paragraph 4</p>
 
  <button id="addClass">Add highlight</button>
  <button id="removeClass">Remove highlight</button>

CSS

.highlight { 
  	background:green;
  }

JavaScript

$("#sidebar-sliding-panel > div > div.sp-toggle > a [aria-selected=false]").click(function () {
 
	  $('.sp-wrap').addClass('sp-open');
 
    });
 
    $("sidebar-sliding-panel > div > div.sp-toggle > a [aria-selected=true]").click(function () {
 
	  $('.sp-wrap').removeClass('sp-open');
 
    });