maurisrx/eventListener1.html Secret

## eventListener1.html
<!DOCTYPE html>
<html>
<head>
    <title>Event Listener - JavaScript</title>
</head>
<body>
    <div class="static">Static</div>
    <button class="add" onclick="return false;">Add</button>
    <script type="text/javascript">
        document.querySelector( '.add' ).addEventListener( 'click', addElement );

        function addElement() {
            var static = document.querySelector( '.static' );
            var dynamic = document.createElement( 'div' );
                dynamic.classList.add( 'dynamic' );
                dynamic.innerText = 'Dynamic';

            static.insertAdjacentElement( 'afterend', dynamic );
        }

        var dynamicElements = document.querySelectorAll( '.dynamic' );
        for ( var i = 0; i < dynamicElements.length; i++ ) {
            dynamicElements[i].addEventListener( 'click', function() {
                this.remove();
            } );
        }
    </script>
</body>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<title>Event Listener - JavaScript</title>
	</head>
	<body>
	<div class="static">Static</div>
	<button class="add" onclick="return false;">Add</button>
	<script type="text/javascript">
	document.querySelector( '.add' ).addEventListener( 'click', addElement );

	function addElement() {
	var static = document.querySelector( '.static' );
	var dynamic = document.createElement( 'div' );
	dynamic.classList.add( 'dynamic' );
	dynamic.innerText = 'Dynamic';

	static.insertAdjacentElement( 'afterend', dynamic );
	}

	var dynamicElements = document.querySelectorAll( '.dynamic' );
	for ( var i = 0; i < dynamicElements.length; i++ ) {
	dynamicElements[i].addEventListener( 'click', function() {
	this.remove();
	} );
	}
	</script>
	</body>
	</html>