CODEWITHSUNDEEP
javascriptjqueryaccordion
firstpostcommenter
firstpostcommenter

Reputation: 2911

Nested accordion - Add Anchor link and accordion inside an accordion

When trying to create a nested accordion, is it possible to create an anchor link and accordion inside another accordion using jquery?

For example, in my code I have <div> for the accordion content and <h3> for accordion header.

Code is https://jsfiddle.net/vsf8kwko/6/

   <div id="outer-accordion">
     <h3>Outer Section </h3>
     <!-- I need to add anchor link under here and not an accordion. Is this possible -->
     <!--<div><li><a href="www.google.com">LINK</a></li></div>-->


    <!-- inner accordian -->    
   <div id="inner-accordion" >

     <h3>Inner Section </h3> //Accordion header
    <div> //Accordion content
        <p>Inner Mauris <a href="www.google.com">LINK</a>.</p>
    </div>


    </div>
    <!-- inner accordian --> 


</div>

Upvotes: 1

Views: 667

Answers (1)

DragonBorn
DragonBorn

Reputation: 1809

You need to put both your link and your inner-accordion inside li tags. I have updated your fiddle. Check it now

<div id="outer-accordion">
     <h3>Outer Section </h3>
     <!-- I need to add anchor link here and not an accordion. Is this possible -->
     <ul>
       <li><a href="www.google.com">LINK</a></li>
       <li>
       <!-- inner accordian -->    
         <div id="inner-accordion" >

           <h3>Inner Section </h3>
          <div>
            <p>Inner Mauris <a href="www.google.com">LINK</a>.</p>
          </div>

        </div>
        <!-- inner accordian --> 
       </li>
     </ul>
</div>

Upvotes: 1

Related Questions