title: Dynamic content loaded from CMS. Staff job description to show once clicked on
body: <p>I am creating a staff members page where it has 3 staff members in a row 33% each of the row and once clicked on a member it displays there description below. The description is 100% of the container. My problem is, once clicked on image it pushes the next two staff members down.</p>
  
  <p>The staff members will be loaded via a CMS, there nothing can be hard coded.</p>
  
  <p>JS Fiddle here: <a href="http://jsfiddle.net/zangief007/BSN5u/1/" rel="nofollow">http://jsfiddle.net/zangief007/BSN5u/1/</a></p>
  
  <p>HTML:
      </p>
  
  <pre><code>      &lt;ul&gt;
          &lt;li&gt;&lt;a href="#" class="job-desc"&gt;&lt;img src="../images/our-people/staff1.png" alt="staff1" width="191" height="191"&gt;&lt;/a&gt;&lt;/li&gt;
          &lt;li&gt;Jon doe&lt;/li&gt;
          &lt;li&gt;09 548 5554&lt;/li&gt;
          &lt;li&gt;jon@gmail.com&lt;/li&gt;
        &lt;/ul&gt;
  
         &lt;p class="description"&gt;Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officiis, tempora, libero, ipsa maxime facere ullam harum ad iusto laborum minima magni officia provident aut obcaecati quaerat fugiat labore qui aliquam.&lt;/p&gt;
  
         &lt;ul&gt;
          &lt;li&gt;&lt;img src="../images/our-people/staff1.png" alt="staff1" width="191" height="191"&gt;&lt;/li&gt;
          &lt;li&gt;Jon doe&lt;/li&gt;
          &lt;li&gt;09 548 5554&lt;/li&gt;
          &lt;li&gt;jon@gmail.com&lt;/li&gt;
  
        &lt;/ul&gt;
  
        &lt;p class="description"&gt;Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officiis, tempora, libero, ipsa maxime facere ullam harum ad iusto laborum minima magni officia provident aut obcaecati quaerat fugiat labore qui aliquam.&lt;/p&gt;
  
  
           &lt;ul&gt;
          &lt;li&gt;&lt;img src="http://placehold.it/150x150" alt="staff1" width="191" height="191"&gt;&lt;/li&gt;
          &lt;li&gt;Jon doe&lt;/li&gt;
          &lt;li&gt;09 548 5554&lt;/li&gt;
          &lt;li&gt;jon@gmail.com&lt;/li&gt;
  
        &lt;/ul&gt;
  
        &lt;p class="description"&gt;Lorem ipsum dolor sit amet, consectetur adipisicing elit. Officiis, tempora, libero, ipsa maxime facere ullam harum ad iusto laborum minima magni officia provident aut obcaecati quaerat fugiat labore qui aliquam.&lt;/p&gt;
  
    &lt;/div&gt;
  </code></pre>
  
  <p>JS:</p>
  
  <pre><code>&lt;script&gt;
  
        $( ".job-desc" ).click(function() {
            $( ".description" ).fadeToggle( "slow", "linear" );
      });
  
    &lt;/script&gt;
  </code></pre>