使用jquery进行选项选择时，如何显示相关div？

<script src="https://cdn.jsdelivr.net/npm/jquery/dist/jquery.min.js"></script>

<select id="option">
  <option value="option1">Option 1</option>
  <option value="option2">Option 2</option>
  <option value="option3">Option 3</option>
</select>

<div id="div1" style="display: none;">Div 1</div>
<div id="div2" style="display: none;">Div 2</div>
<div id="div3" style="display: none;">Div 3</div>

$(document).ready(function() {
  $('#option').change(function() {
    var selectedOption = $(this).val();
    
    // 隐藏所有的div元素
    $('#div1, #div2, #div3').hide();
    
    // 根据选项值显示对应的div元素
    if (selectedOption === 'option1') {
      $('#div1').show();
    } else if (selectedOption === 'option2') {
      $('#div2').show();
    } else if (selectedOption === 'option3') {
      $('#div3').show();
    }
  });
});