JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<div id="intro">
<img
class="example"
id="Asset-15"
src="https://media-cdn.tripadvisor.com/media/photo-s/08/cd/99/1a/hard-rock-hotel-ibiza.jpg">
</div>
JavaScript
preloadFirstPriorityStAssets();
var $image = $('#intro').find('#Asset-15');
function preloadFirstPriorityStAssets() {
// Variables
var i,
s;
var rawDataArray = [
'https://example.com/image9',
'https://example.com/image10',
'https://example.com/image11'],
len = rawDataArray.length;
var $image = $('#intro').find('#Asset-15');
for (i=0; i<len; ++i) {
(function(index) {
var s = rawDataArray[index];
//send to img shell the first raw data-src
//which *automatically* generates src for img via Cloudinary responsive
$image.attr('data-src', s);
//fire off a request to Cl. server to get the correct SRC
//(asynchronous by default)
$.cloudinary.responsive($image);
var stBgAsset15 = new Image();
stBgAsset15.src = $image.attr('src');
})(i);
};
//console.log('stBgAsset15 value: '+stBgAsset15);
console.log('stBgAsset15.src value: '+stBgAsset15.src);
afterClickOnStThrobber();
};
function afterClickOnStThrobber() {
console.log('stBgAsset15 value: '+stBgAsset15);
console.log('stBgAsset15.src value: '+stBgAsset15.src);
}