Reload the DOM probelm

In this example below you will see how to do a Reload the DOM probelm with some HTML / CSS and Javascript

An examaple of how you cannot maniuplate already Manipulated DOM elements

This awesome code was written by stevenamoore, you can see more from this user in the personal repository.
You can find the original code on
Copyright stevenamoore ©


  • HTML
  • CSS
  • JavaScript
<!DOCTYPE html>
<html lang="en" >

  <meta charset="UTF-8">
  <title>Reload the DOM probelm</title>
  <script src="" type="text/javascript"></script>

    <link rel="stylesheet" href="">

      <link rel="stylesheet" href="css/style.css">



  <div class='primary'>
  <div id='replacable'>
    <button id='replace-me'>click to replace</button>
  <div class='replacer' id='replacer1'>
    <button class='go-back'>go back</button>
    this is replacer1
  <script src=''></script>


    <script  src="js/index.js"></script>



/*Downloaded from */
.primary {
  width: 20em;
  height: 20em;
  margin: 5%;
  background-color: green;

#replacable {
  margin: 2.5em;
  width: 15em;
  height: 15em;
  background-color: blue;

.replacer {
  display: none;

/*Downloaded from */
$('#replace-me').on('click', function(){
  var content = $('#replacer1').html();
  var old_content = $(this).parent().html();
  $('.go-back').on('click', function(){