first accordian item start opened

Question

$(document).ready(function () {
        $('.accordian-content').hide();
        $('.accordian-title').click(function () {
            $('.accordian-content').not($(this).next('.accordian-content')).slideUp();
            $(this).next('.accordian-content').slideToggle();
        });
    });

 .accordian-title {
            width: 100%;
            cursor: pointer;
            padding: 20px;
            font-size: 20px;
        }

        .accordian-item {
            color: rgba(40, 150, 211, 1);
            margin: 0 auto 20px auto;
            width: 100%;
            max-width:444px;
            background: #fff;
            border: solid 1px #f0f0f0;
            border-radius: 5px;
            -webkit-box-shadow: -4px 4px 5px 0px rgba(0,0,0,0.29);
            -moz-box-shadow: -4px 4px 5px 0px rgba(0,0,0,0.29);
            box-shadow: -4px 4px 5px 0px rgba(0,0,0,0.29);
        }

        .accordian-content {
            color: #3a3a3a;
            padding: 0 20px;
            text-align: left;
        }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>
<div class="accordian">
                    <div class="accordian-item">
                        <div class="accordian-title">Enhance Your Customer Experience</div>
                        <div class="accordian-content" style="display: none;">
                            <p>Delight your customers with self-service analytics that let them access the data they need, when they need it, without waiting on your busy team.</p>
                        </div>
                    </div>

                    <div class="accordian-item">
                        <div class="accordian-title">Generate New Revenue Opportunities</div>
                        <div class="accordian-content" style="display: none;">
                            <p>Build and sell new data products and services that will clearly demonstrate the value of your overall offering so you can expand existing relationships and gain new customers</p>
                        </div>
                    </div>

                    <div class="accordian-item">
                        <div class="accordian-title">Less Expensive Than Building In-House</div>
                        <div class="accordian-content" style="display: none;">
                            <p>Save valuable development and maintenance time by embedding a flexible analytics platform that lets you meet your vision faster with best-of-breed functionality already baked in.</p>
                        </div>
                    </div>

                </div>

Trying to make the first accordion item start open to indicate that they can be opened/closed. tried using css and setting "active" but can't seem to mix into js and get it to work. Any assistance would be greatly appreciated.

Answer 1

On page load, slide the the first accordion down.

$(document).ready(function () {
        $('.accordian-content').hide();
        $(".accordian-content:first").slideDown();
        $('.accordian-title').click(function () {
            $('.accordian-content').not($(this).next('.accordian-content')).slideUp();
            $(this).next('.accordian-content').slideToggle();
        });
    });

.accordian-title {
            width: 100%;
            cursor: pointer;
            padding: 20px;
            font-size: 20px;
        }

        .accordian-item {
            color: rgba(40, 150, 211, 1);
            margin: 0 auto 20px auto;
            width: 100%;
            max-width:444px;
            background: #fff;
            border: solid 1px #f0f0f0;
            border-radius: 5px;
            -webkit-box-shadow: -4px 4px 5px 0px rgba(0,0,0,0.29);
            -moz-box-shadow: -4px 4px 5px 0px rgba(0,0,0,0.29);
            box-shadow: -4px 4px 5px 0px rgba(0,0,0,0.29);
        }

        .accordian-content {
            color: #3a3a3a;
            padding: 0 20px;
            text-align: left;
        }

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>
<div class="accordian">
                    <div class="accordian-item">
                        <div class="accordian-title">Enhance Your Customer Experience</div>
                        <div class="accordian-content">
                            <p>Delight your customers with self-service analytics that let them access the data they need, when they need it, without waiting on your busy team.</p>
                        </div>
                    </div>

                    <div class="accordian-item">
                        <div class="accordian-title">Generate New Revenue Opportunities</div>
                        <div class="accordian-content" style="display: none;">
                            <p>Build and sell new data products and services that will clearly demonstrate the value of your overall offering so you can expand existing relationships and gain new customers</p>
                        </div>
                    </div>

                    <div class="accordian-item">
                        <div class="accordian-title">Less Expensive Than Building In-House</div>
                        <div class="accordian-content" style="display: none;">
                            <p>Save valuable development and maintenance time by embedding a flexible analytics platform that lets you meet your vision faster with best-of-breed functionality already baked in.</p>
                        </div>
                    </div>

                </div>