LuisMDeveloper/jsbin.guge.css

## jsbin.guge.css
div {
  background-color: #999;
}

## jsbin.guge.html
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>
<body>
  <p>This is the paragraph 1.</p>
  <p id="foo">This is the paragraph 2.</p>
  <p>This is the paragraph 3.</p>
  <p>This is the paragraph 4.</p>
  <div>
    <p>This is the paragraph 5 inside a div.</p>
  </div>


</body>
</html>

## jsbin.guge.js
var pElements = document.getElementsByTagName('p');
var lastPelement = pElements[pElements.length - 1];

var pFoo = document.getElementById('foo');

//alert(pFoo);

var pElementSel = document.querySelector('p');

//alert(pElementSel.parentNode);

var pElementOnDiv = document.querySelector('div p');

//alert(pElementOnDiv);

var pFooSel = document.querySelector('#foo');

alert(pFooSel);
	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<title>JS Bin</title>
	</head>
	<body>
	<p>This is the paragraph 1.</p>
	<p id="foo">This is the paragraph 2.</p>
	<p>This is the paragraph 3.</p>
	<p>This is the paragraph 4.</p>
	<div>
	<p>This is the paragraph 5 inside a div.</p>
	</div>


	</body>
	</html>
	var pElements = document.getElementsByTagName('p');
	var lastPelement = pElements[pElements.length - 1];

	var pFoo = document.getElementById('foo');

	//alert(pFoo);

	var pElementSel = document.querySelector('p');

	//alert(pElementSel.parentNode);

	var pElementOnDiv = document.querySelector('div p');

	//alert(pElementOnDiv);

	var pFooSel = document.querySelector('#foo');

	alert(pFooSel);