Skip to content

Instantly share code, notes, and snippets.

@tilhom
Created November 7, 2018 14:46
Show Gist options
  • Save tilhom/33f72c998c2d3cd60eb28a588cf36e0d to your computer and use it in GitHub Desktop.
Save tilhom/33f72c998c2d3cd60eb28a588cf36e0d to your computer and use it in GitHub Desktop.
dom_manipulation
<!DOCTYPE html>
<html>
<head>
<title>jQuery Crash Course | DOM Manipulation</title>
<script src="https://code.jquery.com/jquery-3.1.0.min.js"></script>
<style>
body{
font-size: 17px;
font-family: arial;
background: #f4f4f4;
line-height: 1.5em;
}
header{
background:#333;
color:#fff;
padding:20px;
text-align: center;
border-bottom: 4px #000 solid;
margin-bottom: 10px;
}
#container{
width:90%;
margin:auto;
padding:10px;
}
.myClass {
color:blue;
background:black;
}
</style>
</head>
<body>
<header>
<h1>jQuery Crash Course | DOM Manipulation</h1>
</header>
<div id="container">
<button id="btn1">Button 1</button>
<p class="para1">This is a paragraph</p>
<p class="para2">This is anothe paragraph</p>
<div id="myDiv"></div>
<input type="text" id="newItem">
<ul id="list">
<li>List Item 1</li>
<li>List Item 2</li>
<li>List Item 3</li>
<li>List Item 4</li>
</ul>
<a href="http://google.com">Google</a>
<ul id="users"></ul>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment