Trying to set up an accordion section on my tumblr page

Question

I've been trying to set this up on my tumblr page for the past 9 hours and nothing I try works. I've googled and googled, tried 20 different methods, and I'm stuck.

I set up a JSfiddle so it's easier to see what I'm going for (and failing at). Can anyone tell me what I'm doing wrong?

https://jsfiddle.net/q50as7u0/4/

<div class="accordion-section"><a class="accordion-section-title" href="#accordion-1">About</a>
  <div class="accordion-section-content" id="accordion-1">
    <p>Test Text</p>
  </div>
  <!--end .accordion-section-content-->
</div>
<!--end .accordion-section-->
<div class="accordion-section"><a class="accordion-section-title" href="#accordion-2">Requirements</a>
  <div class="accordion-section-content" id="accordion-2">
    <p>Test Text 2</p>
  </div>
  <!--end .accordion-section-content-->
</div>
<!--end .accordion-section-->
<div class="accordion-section"><a class="accordion-section-title" href="#accordion-3">Rules</a>
  <div class="accordion-section-content" id="accordion-3">
    <p>Test Text 3</p>
  </div>
  <!--end .accordion-section-content-->
</div>
<!--end .accordion-section-->

Answer 1

You can use this guide on w3schools to set it up.
Working fiddle

var acc = document.getElementsByClassName("accordion");
var i; 

for (i = 0; i < acc.length; i++) {
    acc[i].onclick = function(){
        this.classList.toggle("active");
        var panel = this.nextElementSibling;
        if (panel.style.display === "block") {
            panel.style.display = "none";
        } else {
            panel.style.display = "block";
        }
    }
}

button.accordion {
    background-color: #eee;
    color: #444;
    cursor: pointer;
    padding: 18px;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 15px;
    transition: 0.4s;
}

button.accordion.active, button.accordion:hover {
    background-color: #ccc; 
}

div.panel {
    display: none;
}

<button class="accordion">About</button>
<div class="panel">
  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
</div>

<button class="accordion">Requirements</button>
<div class="panel">
  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
</div>

<button class="accordion">Rules</button>
<div class="panel">
  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
</div>

However this doesn't exactly help your code, so hopefully someone can help you with what is wrong with it.