更改textarea中的图像属性

Question

I have the TinyMCE WYSIWYG text editor. The textarea for the text editor is called .seo_textarea after I hit submit I want all the images inside the textarea to have different data attributes. My logic is as follows:

  $('.social_properties_form').on('submit', function(e) {
            e.preventDefault();
            e.stopImmediatePropagation();

            imgOptimize();

                $.ajax({
                  type: 'POST',
                  url: '',
                  data: new FormData(this),
                  processData: false,
                  contentType: false,
                  success: function(data) {
                 window.location = "/profiles/articles.php";
                  }
                });
                }
        })

function imgOptimize(){
    $(".seo_textarea img").each(function(){
        var original = $(this).attr('src');
        $(this).attr('src', '/media/assets/loading-background.jpg');

        $(this).attr('data-src', original);

        var fileName = original.split('/').pop();

        $(this).attr('data-mobile-src', '/stories/media/images/mobile/' + fileName);
    });
}

Upon submission using Ajax to relay the information to PHP, a new row is inserted with the textarea's values. However, the textarea does not include extra data attributes for images. Instead, the original src is shown and nothing is changed.

How can I make it so that inside my database table I get the new data attributes and the changed src?