JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div id="container">
 <div id="left">
  <img src="http://placehold.it/440x120"/>
 </div>
 <div id="right">
  Click Me
</div>    
    
 </div>

CSS

#container {
 width: 100%;
 border: 1px solid red;
 height: auto;
 overflow: hidden;
    display: table
}

#right {
 border: 1px solid green;
 width: 100px;
 transition: 1s width;
    display: table-cell;
    vertical-align: middle;
}

#left {
 border: 1px solid green;
 width: auto;
 overflow: hidden;
    display: table-cell;
}

#left img {
 max-width: 100%;
 height: auto;
}

#right.wide {
 width: 300px;
}

JavaScript

$(document).ready(function() {
 $("#right").click(function() {
   $(this).toggleClass("wide");
 });
});