<a href="#link">Click</a> <details id="link"> <summary>Text...</summary> blablabla </details>

How to make that when you click on the link, the open attribute for the details tag is added?

  • attribute or class? - Pavel Igorevich

2 answers 2

 $('a').on('click', function() { const id = $(this).attr('href'); $(id).attr('open', function(index, attr) { return attr == 'open' ? null : 'open'; }); }) 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <a href="#link">Click</a> <details id="link"> <summary>Text...</summary> blablabla </details>

    I wrote both the attribute and the class specifically, since I doubt that you need the attribute

     $(document).ready(function(){ $("a[href='#link']").on("click", function(){ $("#link").attr("open"); // Attribute $("#link[open]").css("display", "block") // $("#link").toggleClass("open"); class }) }) 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <a href="#link">Click</a> <details id="link"> <summary>Text...</summary> blablabla </details>

    • @igor Thank you for the changes, but if he presented only html - I suspected that he was already ready to css - Pavel Igorevich
    • one
      Yes you are right. +1 - Igor
    • Thanks for the answer! But I need to add not a class, but an attribute that opens the details (open) tag. In your example, the attribute is not added. You need to get <details id="link" open> - BrimBamBo
    • @BrimBamBo I added an attribute to you, if you want this attribute to open again, then you just need to add a line) - Pavel Igorevich
    • @BrimBamBo edited - Pavel Igorevich