Bootstrap accordion - how to make first open by default

[aaron4osu]

I have a bootstrap accordion. I customized it to add the plus and minus icons. I’m trying to figure out how to start with the first panel expanded and have the minus icon.

I tried adding the “in” class to
<div id="collapseOne" class="panel-collapse collapse " role="tabpanel" aria-labelledby="headingOne">
but then that panel always has the minus sign.

I’m trying to get it so that when the page loads only the first panel is expanded and has a minus sign. Then when another panel is clicked the first closes and turns into a plus sign like the other collapsed panels.

here is a codepen
https://codepen.io/aaron4osu/pen/zYrmNQr

[m_hutley]

@aaron4osu

how to start with the first panel expanded and have the minus icon.

Well, open the inspection tool on one of your panels.

What’s the difference between a panel that is open, and one that is closed, in the HTML?

How can you code the HTML, such that your initial condition is true?