Using a computer with text editing programs (Notepad, MS Word, etc.), create an HTML document file and write the following code: Demo: jQuery addClass() method Add class Add class This is first paragraph. This is second paragraph. This is third paragraph. 2. Using the space given within the second
- Using a computer with text editing programs (Notepad, MS Word, etc.), create an HTML document file and write the following code:
<HTML>
<HEAD>
<SCRIPT SRC="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js">
</SCRIPT>
<SCRIPT>
WRITE YOUR JQUERY CODE HERE!!!
</SCRIPT>
<STYLE>
.yellowDiv{
background-color:yellow;
margin: 10px 0 0 0;
height:50px;
}
.impPrg{
font-size:16px;
font-weight:bold;
}
</STYLE>
</HEAD>
<BODY>
<H1>Demo: jQuery addClass() method</H1>
<BUTTON ID="btnAddDivClass">Add <DIV> class</BUTTON>
<BUTTON ID="btnAddPClass">Add <P> class</BUTTON>
<DIV ID="myDiv">
<P>This is first paragraph.</P>
</DIV>
<DIV>
<p>This is second paragraph.</P>
</DIV>
<DIV>
<P>This is third paragraph.</P>
</DIV>
</BODY>
</HTML>
2. Using the space given within the second <SCRIPT> tag pair complete the code by completing all of the following requirements:
- Write a jQuery script that will change the background property of the <DIV> element with the ID value of myDiv via the yellowDiv CSS class when the button with the ID value of btnAddDivClass is clicked.
- Write a jQuery script that will change the text property of ALL paragraph elements to bold via the imPrg CSS class when the button with the ID value of btnAddPClass is clicked.
Step by step
Solved in 2 steps with 1 images
