How to fade/blend between 2 divs in a less 'clunky' way

Answer 1

'Pleasing' is a very subjective term, however to improve it you could place both div elements within a parent container positioned absolutely so they overlap. You can then fadeToggle() between the two as needed. Something like this:

$('#container').click(function() {
  $(this).find('div').fadeToggle();
})

#container > div {
  position: absolute;
}
#divSecond {
  display: none;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script>
<div id="container">
  <div id="divFirst">some content with images</div>
  <div id="divSecond">different content with images</div>
</div>

Click the text to see the fade transition in action.