JSFiddle - React, Tailwind, and code Playground

HTML

<div class="col-lg-3" id="majic">
            <img src="http://www.endlessicons.com/wp-content/uploads/2013/02/magic-icon-614x460.png" class="center-block img-responsive" style="height:80px; width:80px;">
            <h4>WEB APPLICATIONS</h4>
          </div>

CSS

div
{
    float:left;
}

JavaScript

function hoveronImage(id,imageonhover,imageonhoverout){

    $(id).on('mouseover',function(){

      $(this).children('img').attr('src','http://icons.iconarchive.com/icons/designcontest/vintage/256/Magic-Wand-icon.png').next('h4').css({
        'color':'#eab000 '
      });

    });

    $(id).on('mouseout',function(){

      $(this).children('img').attr('src','http://www.endlessicons.com/wp-content/uploads/2013/02/magic-icon-614x460.png').next('h4').css({
        'color':'#404040'
      });

    });

  }

  hoveronImage('#majic','hovermajic','majic');