Is there a way of writing a function that will replace the standard markup of an inline image within the_content, with a way that moves the size class to a parent container, and a series of data attributes for different sizes of the image?

I've tried using a preg_match function, originally written to remove the autop around the image, but unable to extrapolate the ID of the image and write a new output from that (when I do, it works, but only does so for the first image - all other content from the_content vanishes).

I want this:

<p>
  <img class="alignnone size-medium wp-image-2093" src="http://website.com/wp-content/uploads/image-600x400.jpg" alt="image" width="600" height="400" />
</p>

To become:

<figure id="image-2093" class="size-medium">
  <img src="http://website.com/wp-content/uploads/image-300x200.jpg"
       data-medium="http://website.com/wp-content/uploads/image-600x400.jpg"
       data-large="http://website.com/wp-content/uploads/image-1200x800.jpg"
  />
</figure>

I want to avoid anything using image_send_to_editor, and just use something that will work across the board rather than only on new image embeds.

Thanks in advance.