2-jQuery change content

2-jQuery change content.markdown

2-jQuery change content

Forked from glenda drew's Pen target practice complete.

A Pen by Spencer Mathews on CodePen.

License.

index.html

<section>
<nav>
<ul>
<li></li>
<li id="second"></li>
<li></li>
</ul>
</nav>
</section>

script.js

$(document).ready(function() {
      //console.log("ready");

      //change a css property
      $('body').css('background-color', '#65B6D6');

      //add text through js to the first li by targeting it with the pseudo class first-child

      /*add html text to the second li by targeting its id. include <strong> around one word to see the css in action*/
  
});

scripts

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>

style.css

* {
	margin:0px;
	padding:0px;
}
body {
	background-color:white;
}
section{
	width:4in;
	margin:2in auto 0 auto;
}
ul {
	box-shadow:5px 5px 5px #444;
	border-radius:20px;
}
li {
	list-style-type:none;
	height:1in;
	background-color:#333;
	border-bottom:#CCC 1px solid;
}
li:first-child {
	border-top-left-radius:20px;
	border-top-right-radius:20px;
}
li:last-child {
	border-bottom-left-radius:20px;
	border-bottom-right-radius:20px;
	border-bottom:none;
}
strong {
	color:orange;
}