Horizontal Sliding Panels in WordPress, showing the first panel

I am creating a sliding panel with jQuery on a home page with 5 panels with the code below.

<script type="text/javascript">
jQuery(function($) {

$('a.panel').click(function() {
    var $target = $($(this).attr('href')),
        $other = $target.siblings('.active');

    if (!$target.hasClass('active')) {
        $other.each(function(index, self) {
            var $this = $(this);
            $this.removeClass('active').animate({
                left: $this.width()
            }, 500);
        });

        $target.addClass('active').show().css({
            left: -($target.width())
        }).animate({
            left: 0
        }, 500);
    }
});

});

Currently I need to click to view a panel. Is there a way I can make the first panel show without clicking?

The HTML is:

<div class="panel" id="target1" >
        <div class="inner blue">
            <?php the_field( "dm" );?>
        </div>

    </div>

 <div class="panel" id="target2">
     <div class="inner green">
            <?php the_field( "rd" );?>
     </div>
</div>

<div class="panel" id="target3">
    <div class="inner brown">
        <?php the_field( "cd" );?>
    </div>
</div> 

..etc