Wordpress - Different html for posts within loop

Question

What I'm trying to do:

Write an elseif statement in my loop to display different html markup for the first, second and third posts on the page.

The code

  <div id="content">

        <?php if (have_posts()) : ?>

            <?php $count = 0; ?> 
            <?php while (have_posts()) : the_post(); ?> 
            <?php $count++; ?> 
            <?php if ($count == 1) : ?> 


            <!-- this is the 1st post -->

            <article <?php post_class() ?> id="post-<?php the_ID(); ?>">

                //the html for the first post
                <?php the_title(); ?> //etc

            </article> <!-- end div post -->


            <?php elseif : ?>
            <?php if ($count == 2) : ?>


            <article <?php post_class() ?> id="post-<?php the_ID(); ?>">
                //second post                   
                <?php the_title(); ?> //etc


            </article> <!-- end div post -->


            <?php elseif : ?>
            <?php if ($count == 3) : ?>


            <article <?php post_class() ?> id="post-<?php the_ID(); ?>">
                //third post                    
                <?php the_title(); ?> //etc


            </article> <!-- end div post -->


            <?php else : ?>

        <article <?php post_class() ?> id="post-<?php the_ID(); ?>">
            all the other posts     
            <?php the_title(); ?> etc


        </article> <!-- end div post -->


    <?php endif; ?> 
    <?php endwhile; ?>
    <?php endif; ?>


    </div> <!-- end div content -->

What's actually happening:

Nothing. I'm clearly doing it wrong. I've commented the code so you should have an idea of what I'm trying to achieve here. Perhaps you can point me in the right direction!

Here's some working code, the first post has different markup from the others.

<div id="content">

                <?php if (have_posts()) : ?>

                    <?php $count = 0; ?> 
                    <?php while (have_posts()) : the_post(); ?> 
                    <?php $count++; ?> 
                    <?php if ($count == 1) : ?> 


                    <!-- this is the 1st post -->

                    <article <?php post_class() ?> id="post-<?php the_ID(); ?>">

                        //the html for the first post
                        <?php the_title(); ?> //etc

                    </article> <!-- end div post -->





                    <?php else : ?>

                <article <?php post_class() ?> id="post-<?php the_ID(); ?>">
                    all the other posts     
                    <?php the_title(); ?> etc


                </article> <!-- end div post -->


            <?php endif; ?> 
            <?php endwhile; ?>
            <?php endif; ?>


            </div> <!-- end div content -->

I just want to expand this to have different html for the first, second and third posts.

Answer 1

Problem

 <?php elseif : ?>
 <?php if ($count == 3) : ?>

It's should be

elseif($count == 3) :

Better way

you can use get_template_part to reduce the complexity nested if. created separate for templates like articlepart.php and articlepart-1.php etc.

if(have_posts()):
$count = 0;
    while (have_posts()) : the_post();
        $count++;
        get_template_part('articlepart', $count);

    endwhile;
endif;