<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
<body>
  <div class="result">ボタンを押してください</div>
  <button class="button1">ボタン1</button>
</body>
$(function() {
  $('.button1').on({
    'click': function(){
      $('.result').text('ボタン1が押されました');
    },
    'mouseenter': function(){
      $('.result').text('ボタン1にマウスが乗りました');
    },
    'mouseleave': function(){
      $('.result').text('ボタン1からマウスが離れました');
    }
  });
});

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.