hanbyul-here/gist:981d19e26c1c0d7700b6

## gistfile1.js
<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <!-- Sets initial viewport load and disables zooming  -->
  <meta name="viewport" content="initial-scale=1, maximum-scale=1">
  <title>object literat initialization test</title>

  <style>
  .mom{
    width:500px;
    height:600px;
    background-color:#f00;
    padding:10px;
    margin:20px;
  }
  .child{
    width:480px;
    margin:10px;
    height:100px;
    background-color:#ff0;
  }
  </style>
</head>
<body>
  <div id="mom1" class = "mom">
    <div id="child1" class="child"></div>
    <div id="child2" class="child"></div>
    <div id="child3" class="child"></div>
    <div id="child4" class="child"></div>
    <div id="child5" class="child"></div>
  </div>
  <div id="mom2" class = "mom">
    <div id="child6" class="child"></div>
    <div id="child7" class="child"></div>
    <div id="child8" class="child"></div>
    <div id="child9" class="child"></div>
    <div id="child10" class="child"></div>
  </div>

  <script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
  <script>

  var Mom = (function(){
    var children;
    var thisMom;

    var Mom = function(node){
      thisMom = $(node);
      init();
    }

    var init = function(){
      children = [];
      thisMom.find('.child').each(function(){
        children.push(new Child(this));
      });

    }

    Mom.prototype.spitOut = function(){
      console.log(thisMom.attr('id'));
    }

    return Mom;
  })();


  var Child = (function(){
    var thisChild;

    var Child = function(childNode){
      thisChild = $(childNode);
    }

    var spitOut = function(){
      console.log(thisChild.attr('id'));
    }

    return Child;

  })();


  var moms = [];

  $('.mom').each(function(){
    //moms.push(new Mom(this)); : pointing all mom2
    moms.push(callBackMom(this)); //saved as anonymus function
  });


  function callBackMom(node){
    return function(){
      new Mom(node);
    };
  }


  var i;

  for(i =0; i < moms.length; i++){
    console.log(moms[i]);
  }

  </script>
</body>
</html>
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="UTF-8">
	<!-- Sets initial viewport load and disables zooming -->
	<meta name="viewport" content="initial-scale=1, maximum-scale=1">
	<title>object literat initialization test</title>

	<style>
	.mom{
	width:500px;
	height:600px;
	background-color:#f00;
	padding:10px;
	margin:20px;
	}
	.child{
	width:480px;
	margin:10px;
	height:100px;
	background-color:#ff0;
	}
	</style>
	</head>
	<body>
	<div id="mom1" class = "mom">
	<div id="child1" class="child"></div>
	<div id="child2" class="child"></div>
	<div id="child3" class="child"></div>
	<div id="child4" class="child"></div>
	<div id="child5" class="child"></div>
	</div>
	<div id="mom2" class = "mom">
	<div id="child6" class="child"></div>
	<div id="child7" class="child"></div>
	<div id="child8" class="child"></div>
	<div id="child9" class="child"></div>
	<div id="child10" class="child"></div>
	</div>

	<script src="https://code.jquery.com/jquery-2.1.4.min.js"></script>
	<script>

	var Mom = (function(){
	var children;
	var thisMom;

	var Mom = function(node){
	thisMom = $(node);
	init();
	}

	var init = function(){
	children = [];
	thisMom.find('.child').each(function(){
	children.push(new Child(this));
	});

	}

	Mom.prototype.spitOut = function(){
	console.log(thisMom.attr('id'));
	}

	return Mom;
	})();


	var Child = (function(){
	var thisChild;

	var Child = function(childNode){
	thisChild = $(childNode);
	}

	var spitOut = function(){
	console.log(thisChild.attr('id'));
	}

	return Child;

	})();



	var moms = [];

	$('.mom').each(function(){
	//moms.push(new Mom(this)); : pointing all mom2
	moms.push(callBackMom(this)); //saved as anonymus function
	});


	function callBackMom(node){
	return function(){
	new Mom(node);
	};
	}


	var i;

	for(i =0; i < moms.length; i++){
	console.log(moms[i]);
	}

	</script>
	</body>
	</html>