Jquery 当我单击一个按钮时，它会打开/关闭 div

Question

这是我创建的层次结构，我面临的问题是当我单击查看信息时，它会打开并关闭下一个 div/card。 但我的目标是稍后在其中添加一个模式。 我不明白 jQuery 我在 JavaScript 中编码。 谁能帮我解决这个问题。 我想要做的是，当我点击查看信息时，它不应该切换任何 class。

$(function () {
    $('.genealogy-tree ul').hide();
    $('.genealogy-tree>ul').show();
    $('.genealogy-tree ul.active').show();
    $('.genealogy-tree li').on('click', function (e) {
        var children = $(this).find('> ul');
        if (children.is(":visible")) children.hide('fast').removeClass('active');
        else children.show('fast').addClass('active');
        e.stopPropagation();
    });
});

                                        <ul>
                                          <li>
                                            <div class="card">
                                              <div class="imgBx">
                                                <img src="./dr hassan.jpg" alt="vice-chancellor-image" />
                                              </div>
                                              <div class="content">
                                                <div class="details">
                                                  <h2>Dr. Mudassir</h2>
                                                  <h3>Director Admissions
                                                  </h3>
                                                  <div class="actionBtn">
                                                    <!-- <button>View Info</button> 
                                                    -->
                                                    <a href="#" class="cta">
                                                      <span>View Info</span>
                                                      <svg width="13px" height="10px" viewBox="0 0 13 10">
                                                        <path d="M1,5 L11,5"></path>
                                                        <polyline points="8 1 12 5 8 9"></polyline>
                                                      </svg>
                                                    </a>
                                                  </div>
                                                </div>
                                              </div>
                                            </div>
                                          </li>
                                        </ul>

** Github： https://github.com/dev-adan/University-Projects **

Answer 1

我删除了切换 class 的部分，但至于你所说的模态等，很难理解你的意思或试图完成的事情。

$(function () {
    $('.genealogy-tree ul').hide();
    $('.genealogy-tree>ul').show();
    $('.genealogy-tree ul.active').show();
    $('.genealogy-tree li').on('click', function (e) {
        var children = $(this).find('> ul');
        if (children.is(":visible")) children.hide('fast');
        else children.show('fast');
        e.stopPropagation();
    });
});