This works for me. Is it what you meant?
$(function() {
var html = $(".tile").map(function() {
return $(this).html();
}).get()
$(".tile").eq(0).html(html).css({
"width": "300px",
"background": "#012496"
});
$(".tile:gt(0)").remove();
});
div.tile {
float: left;
width: 100px;
height: 50px;
border: 3px solid yellow;
text-align:center;
}
div.tile1 {
float: left;
width: 100px;
height: 50px;
border: 3px solid yellow;
text-align:center;
}
hr, br { clear:both }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Before<br/>
<div class="tile1"></div>
<div class="tile1" style="background:#012496">
<a href="https://stackoverflow.com/questions/52944836/JavaScript:window.close()" style="color:white; font-size:20px;">BACK</a>
</div>
<div class="tile1"></div>
<br/>
<hr/>
After<br/>
<div class="tile"></div>
<div class="tile" style="background:#012496">
<a href="https://stackoverflow.com/questions/52944836/JavaScript:window.close()" style="color:white; font-size:20px;">BACK</a>
</div>
<div class="tile"></div>
solved How can I merge
with another
? [closed]