JSFiddle - React, Tailwind, and code Playground
by KIRAN VARTHI
HTML
<p>Here's my HTML:</p>
<span class="button spacy">Click</span>
<div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</div>
<p>
I want it to look like this without changing the HTML:
</p>
<span class="button">Click Me</span>
<br>
<img src="http://upload.wikimedia.org/wikipedia/commons/3/39/Cat_used_in_a_user_box_template.JPG">
<div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</div>
CSS
.button {
background-color: lightblue;
cursor: pointer;
}
.spacy p {
padding: 0;
margin: 0;
}
.spacy img {
display: block;
}
JavaScript
$( ".spacy" ).append( "<p><img src='http://upload.wikimedia.org/wikipedia/commons/3/39/Cat_used_in_a_user_box_template.JPG'></p>" );