如何使用jquery和bootstrap在一个模式上使用多个按钮

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>

<button id="button1" class="btn btn-primary">按钮1</button>
<button id="button2" class="btn btn-primary">按钮2</button>
<button id="button3" class="btn btn-primary">按钮3</button>

$(document).ready(function() {
  $('#button1, #button2, #button3').click(function() {
    // 在这里编写按钮点击时的逻辑代码
  });
});

$(document).ready(function() {
  $('#button1, #button2, #button3').click(function() {
    // 按钮1的点击逻辑
    if ($(this).attr('id') === 'button1') {
      // 执行按钮1的逻辑代码
    }
    
    // 按钮2的点击逻辑
    if ($(this).attr('id') === 'button2') {
      // 执行按钮2的逻辑代码
    }
    
    // 按钮3的点击逻辑
    if ($(this).attr('id') === 'button3') {
      // 执行按钮3的逻辑代码
    }
  });
});