WordPress fetching posts in home page

i am trying to fetch posts in bootstrap accordian like this

<div class="container">
  <div class="panel-group" id="accordion">
        <?php
            if ( have_posts() ) :
                // Start the Loop.
                while ( have_posts() ) :the_post ();?>
                <div class='col-md-12 col-xs-12'>
                </div>
                <div class="panel panel-default">
                <div class="panel-heading">
                <h4 class="panel-title">
                <a data-toggle="collapse" data-parent="#accordion" href="#collapseOne" aria-expanded="false" class="collapsed"><?php echo the_title()?></a>
           </h4>
            </div>
            <div id="collapseOne" class="panel-collapse collapse" aria-expanded="false" style="height: 0px;">
            <div class="panel-body">
            <p><?php echo the_content()?></p>
            </div>
            </div>
            </div>
             <?php
              get_template_part( 'content', get_post_format() );
              endwhile;
              twentyfourteen_paging_nav();

            else :
                // If no content, include the "No posts found" template.
                get_template_part( 'content', 'none' );

            endif;
        ?>
                </div>

    <?php // get_sidebar( 'content' ); ?>
                </div>

now problem is that once post content is printed inside accordian and once again its getting printed outside accoridan

Read More

enter image description here

Related posts