<div class="wrapper online">
  <img class="avatar" src="data:image/jpeg;base64,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" />
 
  <button type="button" class="online">Trigger user online</button>
  <button type="button" class="offline">Trigger user offline</button>
  
</div>
body{
  background: radial-gradient(center, ellipse cover, #ffffff 0%,#bbbbbb 100%);
}

.wrapper{
  font-size: 20px;
  text-align: center;
}

.avatar{
    width: 200px;
    display: block;
    margin: 0 auto;
    margin: 10px auto;
    border-radius: 5px;
    transition: all 1s;
  }

.wrapper.online .online,
.wrapper:not(.online) .offline{display: none;}

.wrapper:not(.online) .avatar{
  filter: grayscale(1);
}
var $wrapper = $('.wrapper');
var $btns = $wrapper.find('button');
var onlineClass = 'online';

$btns.on('click', function(){
  $wrapper.toggleClass(onlineClass);
});

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. //cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js