title: How do I add div around each WordPress post images & retrieve hovered image for social sharing?
body: <p>I want to add div around every images in my posts in order to be able to add social share icons on hover.
  For this, I've used this useful code shared by Rick Sanchez: <a href="https://stackoverflow.com/questions/25403001/how-do-i-add-a-div-around-each-wordpress-post-image">How do I add A Div around each WordPress post image ?</a></p>
  
  <pre class="lang-php prettyprint-override"><code>function breezer_addDivToImage( $content ) {
     // A regular expression of what to look for.
     $pattern = '/(&lt;img([^&gt;]*)&gt;)/i';
     // What to replace it with. $1 refers to the content in the first 'capture group', in parentheses above
     $the_url = the_permalink();
     $replacement = '&lt;div class="imgWrap"&gt; 
                          $1
                          &lt;div class="imgDescription"&gt;
                                              &lt;div class="theShareLinks"&gt;
                                                  &lt;img src="http://localhost/mysite/wp-content/uploads/2014/08/dfc2.png" /&gt;
                                                  &lt;a href="http://twitter.com/share?text=&amp;url='.get_the_permalink() .'" class="img-twitter" title="Share on Twitter" target="_blank"&gt;&lt;/a&gt;
                                                  &lt;a href="http://www.facebook.com/sharer.php?u='.get_the_permalink() .'?" class="img-facebook" title="Share on Facebook" target="_blank" onclick="window.open(this.href, \'newwin\', \'width=500, height=200\'); return false;" &gt;&lt;/a&gt;
                                                  &lt;a href="https://plus.google.com/share?url='.get_the_permalink() .'" class="img-google" title="Share on Google" target="_blank"&gt;&lt;/a&gt;
                                              &lt;/div&gt;
                                          &lt;/div&gt;
                      &lt;/div&gt;';
  
     // run preg_replace() on the $content
     $content = preg_replace( $pattern, $replacement, $content );
  
     // return the processed content
     return $content;
  }
  
  add_filter( 'the_content', 'breezer_addDivToImage' );
  </code></pre>
  
  <p>With this code, I'm now able to display share icons above each image (twitter, google &amp; facebook) but my problem is that the image shared is always the first image of the post and not the image hovered (for example second, third and so on).
  Do you have any idea how I could do this based on the code provided by Rick? How it could be possible to retrieve the hovered image?</p>
  
  <p>Thanks a lot for your help!</p>