This is paragraph 1.
This is paragraph 2.
This is paragraph 3.
This is paragraph 4.
<script type="text/javascript" src="./jquery-1.5.1.js"></script>
<script type="text/javascript">
function stripe1() {
$('div p.first').toggleClass("striped");
}
function stripe2() {
$('div p.second').toggleClass("striped");
}
function stripe3() {
$('div p.third').toggleClass("striped");
}
function stripe4() {
$('div p.fourth').toggleClass("striped");
}
</script>
<style type="text/CSS">
<!--
.code { color: red; }
.back { background-color: yellow; }
-->
</style>
</head>
<body>
<h1>jQuery: Select a paragraph based on style</h1>
<div>
<p class="first">This is paragraph 1.</p>
<p class="second">This is paragraph 2.</p>
<p class="third">This is paragraph 3.</p>
<p class="fourth">This is paragraph 4.</p>
</div>
<form action="">
<input type="button" value="Stripe" onclick="stripe1()"></input>
<input type="button" value="Stripe" onclick="stripe2()"></input>
<input type="button" value="Stripe" onclick="stripe3()"></input>
<input type="button" value="Stripe" onclick="stripe4()"></input>
</form>