title: How to wrap each word in a span but retain text formatting
body: <p>How can I wrap each word in a span and retain text formatting? e.g. br, <em>em</em>, <strong>strong</strong></p>
  
  <p>I'm using the following code to wrap each word from a rich text editor in a span, but it's stripping out all my formatting.</p>
  
  <pre><code>$(window).load(function() {
  $(".hero_image p").addClass("hero_image_caption");
  $('.hero_image p').each(function(){
      var text = $(this).text().split(' ');
  
      for( var i = 0, len = text.length; i &lt; len; i++ ) {
          text[i] = '&lt;span&gt;' + text[i] + '&lt;/span&gt;';
          }
          $(this).html(text.join(' '));
  
          });        
  });
  </code></pre>