JQuery | jqtest2

<div class="box">
  <h3></h3>
  <input type="button" value="proc1()" onclick="proc1()">
  <input id="butok" type="button" value="butok">
  
  <div id="result1">
     <h1> 제목입니다 </h1>
	 <h2 id="para"> 작은 제목입니다 </h2>
	 <h2 class="sample"> 샘플입니다 </h2>
  </div>
  
</div>

Inputラベルのidを使用してイベントハンドラを設定する

$(document).ready(function(){
	 $('#butok').on('click', function(){
         //result1 배경색을 변경 
         $('#result1').css('background', 'yellow');
         
         // h1요소의 글자색을 파랑
         $('h1').css('color', 'blue');
         
	     //id가 para인 요소의 글자색은 녹색
	     $('#para').css('color', 'green');
	     
	     //class 가 sample요소의 글자색은 빨강 
	     $('.sample').css('color', 'red');
	 });
 });

inputラベルでonclick=proc 1()で呼び出されます

 function proc1() {
	 //result1 배경색을 변경 
     $('#result1').css('background', 'yellow');
     
     // h1요소의 글자색을 파랑
     $('h1').css('color', 'blue');
     
     //id가 para인 요소의 글자색은 녹색
     $('#para').css('color', 'green');
     
     //class 가 sample요소의 글자색은 빨강 
     $('.sample').css('color', 'red');
 }