jQuery addClass example

Change class name on click in jQuery

by Gereltod Gotsbayar

HTML

<div class="container">
  <div class="item item-1"></div>
  <div class="item item-2"></div>
</div>

CSS

:root {
  background-color: white;
}
.container {
  border: 3px solid #cecece;
  display: flex;
}
.item {
  color: white;
}
.item-1 {
  background-color: red;
  flex: 1 1 100px;
  order: 2;
  display: flex;
}
.item-2 {
  background-color: blue;
  flex: 1 1 100px;
  order: 1;
  display: flex;
}

JavaScript

$(function(){
	
  $('.item-1').html($('.item-1').width());
  $('.item-2').html($('.item-2').width());
  
})