javascript - 单击另一个 div 时，div 不会隐藏和显示

Question

我写了一个页面，如下所示....
Click here!
我使用 jQuery 隐藏一个 div 并在单击另一个 div 时显示隐藏的 div。但它不起作用。我怎样才能让它发挥作用？
这是我的 jQuery 代码:

<script>

    $(document).ready(
        function() {
            $('#offerOne').attr('style', 'background-color: #F96433 !important');
            $("#offerDetailsOne").hide();
            $('#offerTwo').on("click", function() {
                $('#offerDetailsOne').toggle();
            });

        });
    </script>

Answer 1

$(document).ready(
  function() {
    $('#offerOne').attr('style', 'background-color: #F96433 !important');

    $("#offerTwo").hide();
    $('#offerToggle').on("click", function() {
      $('#offerOne').toggle();
      $('#offerTwo').toggle();
    });

  });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

<p id="offerOne">I Am Offer One</p>
<p id="offerTwo">I Am Offer two</p>
<p id="offerToggle">I am toggle!</p>