How can i use different content to each tab in Wordpress

Question

I have 3 tabs which made with jQuery Ui, in each tab i need to make different mark up and content, each tab have unique id. How can i insert, to tab with id #tabs-2, this content. If i try to insert this after the_content, its generates in each tab same thing.

<div id="tabs-2">

            <div class="row">
            <div class="col-md-3">
                <img src="img/about_multi.gif" alt="">
                <h4>We Are Multi-Disciplinary</h4>
                <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Hic consequatur voluptatum illum commodi, possimus culpa incidunt vero repudiandae neque quas, rerum quis, consequuntur illo molestiae necessitatibus ea explicabo architecto impedit!</p>
            </div>  

This is, how it's looks now!

<?php  
    $id = 7;
    $post_tabs = new WP_Query(array('cat'=> $id, 'post_per_page' => 5));
    ?>

    <?php if ($post_tabs-> have_posts() ) :  ?>

    <div class="tabs">
        <ul class="menu-nav">
    <?php while ( $post_tabs->have_posts() ) : $post_tabs->the_post(); ?>
        <li><a href="#tabs-<?php the_ID(); ?>"><?php the_title(); ?></a></li>
    <?php endwhile; ?>

        </ul>

    <?php while ( $post_tabs->have_posts() ) : $post_tabs->the_post(); ?>
        <div id="tabs-<?php the_ID(); ?>">
            <?php the_content(); ?>
        </div>

    <?php endwhile; ?>


    </div>
    <?php else: ?>
    <!-- no posts found -->
    <?php endif; ?>

Answer 1

Just do a check for the respective id:

<?php while ( $post_tabs->have_posts() ) : $post_tabs->the_post(); ?>
        <div id="tabs-<?php the_ID(); ?>">
            <?php the_content();
if (the_ID()==2) {

    echo
    '<div id="tabs-2">

                <div class="row">
                <div class="col-md-3">
                    <img src="img/about_multi.gif" alt="">
                    <h4>We Are Multi-Disciplinary</h4>
                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Hic consequatur voluptatum illum commodi, possimus culpa incidunt vero repudiandae neque quas, rerum quis, consequuntur illo molestiae necessitatibus ea explicabo architecto impedit!</p>
                </div>';

}  ?>
        </div>