Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!DOCTYPE html>
<html>
<head>
<script src="http://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.6.2/html5shiv.js"></script>
<script src="http://cdnjs.cloudflare.com/ajax/libs/sizzle/1.10.15/sizzle.min.js"></script>
  
<meta charset=utf-8 />
<title>JS Bin</title>
  <style>
    header, section, footer {
      border : #000 solid 1px;
      margin : 5px;
      padding : 5px;
      font-weight: 700;
    }
    
    header.main {
      font-size: 30px;
    }
    
    body {
      color: #f00;
    }
    
    .green * {
      color: #0c0;
    }
    
    .blue * {
      color: #00c;
    }
  </style>
</head>
<body>
  <div class='green'>
    <header class="main">Title</header> 
    <header>Subtitle</header> 
    <section>
        Section
    </section>
    <footer>Footer</footer> 
  </div>
  <div class='blue' id='b'>
  </div>
  <script type="text/javascript">
      var source = Sizzle('.green', document)[0];
    
      var length = source.childNodes.length;
      var docFrag = document.createElement("div");
    
      for (var i = 0; i < length; i++) {
        docFrag.appendChild(source.childNodes[i].cloneNode(true));
      }
  
      var main = Sizzle('header[class]', docFrag);
    
      if(main.length > 0){
        document.getElementById('b').appendChild(main[0]);
      }
  </script>
</body>
</html>
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
jslegerspro
0viewers