jQuery addClass example

Change class name on click in jQuery

HTML

<div id="section-1-details-objectifs1-plus" data-target="1">ouvrir test 1 +</div>
<div id="section-1-details-objectifs2-plus" data-target="2">ouvrir test 2 +</div>
<div id="section-1-details-objectifs3-plus" data-target="3">ouvrir test 3 +</div>

<div id="section-1-details-objectifs1">Test1</div>
<div id="section-1-details-objectifs2">Test2</div>
<div id="section-1-details-objectifs3">Test3</div>

CSS

#section-1-details-objectifs1, #section-1-details-objectifs2, #section-1-details-objectifs3 {
	width:100%;
	height:20px;
	display: none;
	margin-bottom: 0;
  background-color: blue;
  color: white;
  cursor: pointer;
}

JavaScript

$(document).ready(function(){
   $("[id$='plus']").on('click', function(){
   idx= $(this).data('target');
   $("[id^='section-1-details-objectifs']").not("[id$='plus']").not($('#section-1-details-objectifs'+idx)).slideUp();
   $('#section-1-details-objectifs'+idx).slideDown();
   })
});