ritcheyer/jsbin.yalol.css

## jsbin.yalol.css
/* --- Test 1 ------------------------- */
.outer {
  background-color: #f00;
  width: 100px;
  height: 100px;
}

.inner {
  background-color: #0f0;
  width: 70px;
  height: 70px;
}


/* --- Test 2 ------------------------- */


/* --- Test 3 ------------------------- */

## jsbin.yalol.html
<!DOCTYPE html>
<html>
  <head>
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
    <meta name="description" content="Monir Mamoun">
    <meta charset="utf-8">
    <title>Interview Coding Questions - Monir Mamoun</title>
  </head>
  <body>

    <h1>HTML/CSS Test 1</h1>

    <div class="outer">
      <div class="inner"></div>
    </div>

    <hr>

    <h1>HTML/CSS Test 2</h1>

    <div>
      <ul>
        <li>Make Me Red!</li>
        <li>I should be black
          <ul>
            <li>I should be black</li>
            <li>I should be black</li>
          </ul>
        </li>
        <li>Make me Green!</li>
      </ul>
    </div>

    <div>
      <ul>
        <li>I should be black not red!</li>
        <li>I should be black
          <ul>
            <li>I should be black</li>
            <li>I should be black</li>
          </ul>
        </li>
        <li>Make me green!</li>
      </ul>
    </div>

    <hr>

    <h1>HTML/CSS Test 3</h1>
    <!-- Please make the phone number bold without
         touching the DOM and only CSS -->

    <h2>Robert Shuka</h2>
    <p>Phone: <span>(123) 456-7890</span></p>
    <p>Address: <span>123 Some Address, Ames, IA 50010</span></p>

    <hr>

    <h1>Javascript Test 1</h1>
    <button onclick="a();">trigger a()</button>
    <button onclick="b();">trigger b()</button>

    <hr>

    <h1>Javascript Test 2</h1>
    <button onclick="f();">scope</button>

    <hr>

    <h1>Javascript Test 3</h1>
    <p id="paragraph"></p>
    <button onclick="updateP('hello');">updateP('hello')</button>

  </body>
</html>

## jsbin.yalol.js
/*
 * Candidate: Luke Stebner
 * Date: 2014-02-28
 */

// --------------------------------------
// Q: What do the following evaluate to?
//  1 == true
//  1 === true
//  2 == true

// --------------------------------------
// Q: Given the following code snippet, what
//    will happen when a() or and b() are triggered?
function showMe( num ) {
  var logIt = function() { console.log( num ); };
  num++;
  return logIt;
}

var a = showMe( 5 );
var b = showMe( 10 );

// a();
// b();


// --------------------------------------
// Q: What is hoisting?


// --------------------------------------
// Q: What will the following trace out:
var scope = "global";
function f() {
  console.log( scope ); //Prints?
  var scope = "local";
  console.log( scope );  //Prints?
}

// --------------------------------------
// Q: What is happening in this example?
var factory = function myFunction ( el ) {
  return function set( html ){
    $( el ).html( html );
  };
};

var updateP=factory( "#paragraph" );
// updateP( 'hello' );
// --------------------------------------
	/* --- Test 1 ------------------------- */
	.outer {
	background-color: #f00;
	width: 100px;
	height: 100px;
	}

	.inner {
	background-color: #0f0;
	width: 70px;
	height: 70px;
	}



	/* --- Test 2 ------------------------- */



	/* --- Test 3 ------------------------- */
	<!DOCTYPE html>
	<html>
	<head>
	<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
	<meta name="description" content="Monir Mamoun">
	<meta charset="utf-8">
	<title>Interview Coding Questions - Monir Mamoun</title>
	</head>
	<body>

	<h1>HTML/CSS Test 1</h1>

	<div class="outer">
	<div class="inner"></div>
	</div>

	<hr>

	<h1>HTML/CSS Test 2</h1>

	<div>
	<ul>
	<li>Make Me Red!</li>
	<li>I should be black
	<ul>
	<li>I should be black</li>
	<li>I should be black</li>
	</ul>
	</li>
	<li>Make me Green!</li>
	</ul>
	</div>

	<div>
	<ul>
	<li>I should be black not red!</li>
	<li>I should be black
	<ul>
	<li>I should be black</li>
	<li>I should be black</li>
	</ul>
	</li>
	<li>Make me green!</li>
	</ul>
	</div>

	<hr>

	<h1>HTML/CSS Test 3</h1>
	<!-- Please make the phone number bold without
	touching the DOM and only CSS -->

	<h2>Robert Shuka</h2>
	<p>Phone: <span>(123) 456-7890</span></p>
	<p>Address: <span>123 Some Address, Ames, IA 50010</span></p>

	<hr>

	<h1>Javascript Test 1</h1>
	<button onclick="a();">trigger a()</button>
	<button onclick="b();">trigger b()</button>

	<hr>

	<h1>Javascript Test 2</h1>
	<button onclick="f();">scope</button>

	<hr>

	<h1>Javascript Test 3</h1>
	<p id="paragraph"></p>
	<button onclick="updateP('hello');">updateP('hello')</button>

	</body>
	</html>
	/*
	* Candidate: Luke Stebner
	* Date: 2014-02-28
	*/

	// --------------------------------------
	// Q: What do the following evaluate to?
	// 1 == true
	// 1 === true
	// 2 == true

	// --------------------------------------
	// Q: Given the following code snippet, what
	// will happen when a() or and b() are triggered?
	function showMe( num ) {
	var logIt = function() { console.log( num ); };
	num++;
	return logIt;
	}

	var a = showMe( 5 );
	var b = showMe( 10 );

	// a();
	// b();


	// --------------------------------------
	// Q: What is hoisting?


	// --------------------------------------
	// Q: What will the following trace out:
	var scope = "global";
	function f() {
	console.log( scope ); //Prints?
	var scope = "local";
	console.log( scope ); //Prints?
	}

	// --------------------------------------
	// Q: What is happening in this example?
	var factory = function myFunction ( el ) {
	return function set( html ){
	$( el ).html( html );
	};
	};

	var updateP=factory( "#paragraph" );
	// updateP( 'hello' );
	// --------------------------------------