vapidbabble · January 19, 2018 01:29
diff --git a/index.html b/index.html
 <html>
  <head>
    <title>jQuery Mini Challenge 1</title>
  </head>
  <body>
    <header>
      <h1 id ="main-heading">Introducing jQuery</h1>
    </header>
    <section class = "first-section">
      <h3>What is jQuery?</h3>
      <p>jQuery is a fast, small, and feature-rich JavaScript library. It makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that works across a multitude of browsers. With a combination of versatility and extensibility, jQuery has changed the way that millions of people write JavaScript.</p>
    </section>
    <section class = "second-section">
      <h3>Why jQuery?</h3>
      <ul>
        <li class="list-item">Lightweight Footprint</li>
        <li class="list-item">CSS3 Compliant</li>
        <li class="list-item">Cross-Browser</li>
      </ul>
    </section>
    
    <footer>
      <p>Source: <a href="https://jquery.com/">www.jquery.com</a></p>
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    </footer>
  </body>
 </html>
diff --git a/jquery-101-mini-challenge-1.markdown b/jquery-101-mini-challenge-1.markdown
diff --git a/script.js b/script.js
 //Use jQuery by including a script tag in your html and using this as your CDN source: "https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"

 //Make sure the page has loaded and is ready to be manipulated:  
  
  //1. Select the element with id "main-heading" and log its text to console.
  var mainheading = $("#main-heading").html();
  console.log(mainheading);

  //2. Select the element with class "first-section" and log its text to console.
  var firstsection = $(".first-section").html();
  console.log(firstsection);

 //3. Select elements with the html tag h3 and log its text to console.
  var h3 = $("h3");

 h3.each(function(currentElement){
  console.log("h3 tags", currentElement.html());
 });

 //4. Select the second item in the list(using the class "list-item") and log its text to console.

 console.log("Second list item:", $(".list-item").eq(1).html());
diff --git a/scripts b/scripts
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
	<html>
	<head>
	<title>jQuery Mini Challenge 1</title>
	</head>
	<body>
	<header>
	<h1 id ="main-heading">Introducing jQuery</h1>
	</header>
	<section class = "first-section">
	<h3>What is jQuery?</h3>
	<p>jQuery is a fast, small, and feature-rich JavaScript library. It makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that works across a multitude of browsers. With a combination of versatility and extensibility, jQuery has changed the way that millions of people write JavaScript.</p>
	</section>
	<section class = "second-section">
	<h3>Why jQuery?</h3>
	<ul>
	<li class="list-item">Lightweight Footprint</li>
	<li class="list-item">CSS3 Compliant</li>
	<li class="list-item">Cross-Browser</li>
	</ul>
	</section>

	<footer>
	<p>Source: <a href="https://jquery.com/">www.jquery.com</a></p>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
	</footer>
	</body>
	</html>
	//Use jQuery by including a script tag in your html and using this as your CDN source: "https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"

	//Make sure the page has loaded and is ready to be manipulated:

	//1. Select the element with id "main-heading" and log its text to console.
	var mainheading = $("#main-heading").html();
	console.log(mainheading);

	//2. Select the element with class "first-section" and log its text to console.
	var firstsection = $(".first-section").html();
	console.log(firstsection);

	//3. Select elements with the html tag h3 and log its text to console.
	var h3 = $("h3");

	h3.each(function(currentElement){
	console.log("h3 tags", currentElement.html());
	});

	//4. Select the second item in the list(using the class "list-item") and log its text to console.

	console.log("Second list item:", $(".list-item").eq(1).html());