JSFiddle - React, Tailwind, and code Playground

by s4ty

HTML

<img src="images/cotton-flower.jpg" class="rotate_front" alt="" />
<img src="images/cotton-flower1.jpg" class="rotate_back" alt="" /> 
<!--
<div id="rotate">
    <div id="rule">
        <div class="container picture">
            <div class="swap">
                <div class="face front">
                    <img src="images/cotton-flower.jpg" alt="" />
                </div>
                <div class="face back">
                    <img src="images/cotton-flower1.jpg" alt="" />
                </div>
            </div>
        </div>
    </div>
</div>      
-->

JavaScript

$(function(){
    
    var myStylesLocation = "Link zur.css";
        $('<style type="text/css"></style>')
            .html('@import url("' + myStylesLocation + '")')
            .appendTo("head");
    
        $(".rotate_back")
            .wrap('<div id="rotate"/>')
            .wrap('<div id="rule"/>')
            .wrap('<div class="cointainer picture"/>')
            .wrap('<div class="swap"/>')
            .wrap('<div class="face back" />')
        
        $(".rotate_front")
            .prependTo('div.swap')
            .wrap('<div class="face front" />')
    
})