JSFiddle - React, Tailwind, and code Playground

by johntrepreneur

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<div id="outer">outer 
  <div id="middle">middle 
    <div id="inner">inner</div>
    <div id="inner2">inner2</div>
  </div>
</div>

CSS

#outer {
  background-color: orange;
  height: 300px;
  width: 300px;
  font-size: 12px;
}
#middle {
  background-color: pink;
  height: 200px;
  width: 200px;
  font-size: 12px;
}
#inner, #inner2 {
  height: 100px;
  width: 100px;
  font-size: 12px;
}
#inner {
  background-color: yellow;
}
#inner2 {
  background-color: lightblue;
}

JavaScript

alert($('#outer').find('*:not(#inner)').addBack()[0].outerHTML);
$('#outer').find('*:not(#inner)').addBack().css('font-size', '30px');