I have a simple gallery that hides and show images. It works fine however I am not satisfy with my approach. My javascript seemed redundant. Can you check my code and give better idea on how can I improve it.

This is my html

<div class="big_img_wrapper">
                <img src="<?= IMAGEPATH ?>front_page/phinfo/house_rentals/westgate/big_img_1.JPG" id="big_img_1" class="big_img">
                <img src="<?= IMAGEPATH ?>front_page/phinfo/house_rentals/westgate/big_img_2.JPG" id="big_img_2" class="big_img">
                <img src="<?= IMAGEPATH ?>front_page/phinfo/house_rentals/westgate/big_img_3.JPG" id="big_img_3" class="big_img">
                <img src="<?= IMAGEPATH ?>front_page/phinfo/house_rentals/westgate/big_img_4.JPG" id="big_img_4" class="big_img">
                <img src="<?= IMAGEPATH ?>front_page/phinfo/house_rentals/westgate/big_img_5.JPG" id="big_img_5" class="big_img">
                <img src="<?= IMAGEPATH ?>front_page/phinfo/house_rentals/westgate/big_img_6.JPG" id="big_img_6" class="big_img">
            </div>
            <div class="thumbs_img_wrapper">
                <img src="<?= IMAGEPATH ?>front_page/phinfo/house_rentals/westgate/thumbnails/thumbs_img_1.jpg" id="thumbs_img_1" calss="thumbs_img">
                <img src="<?= IMAGEPATH ?>front_page/phinfo/house_rentals/westgate/thumbnails/thumbs_img_2.jpg" id="thumbs_img_2" calss="thumbs_img">
                <img src="<?= IMAGEPATH ?>front_page/phinfo/house_rentals/westgate/thumbnails/thumbs_img_3.jpg" id="thumbs_img_3" calss="thumbs_img">
                <img src="<?= IMAGEPATH ?>front_page/phinfo/house_rentals/westgate/thumbnails/thumbs_img_4.jpg" id="thumbs_img_4" calss="thumbs_img">
                <img src="<?= IMAGEPATH ?>front_page/phinfo/house_rentals/westgate/thumbnails/thumbs_img_5.jpg" id="thumbs_img_5" calss="thumbs_img">
                <img src="<?= IMAGEPATH ?>front_page/phinfo/house_rentals/westgate/thumbnails/thumbs_img_6.jpg" id="thumbs_img_6" calss="thumbs_img">
            </div>

This is my css

.big_img_wrapper, .big_img_wrapper img{
        width: 370px;
        height: 246px;
        /*display: none;*/
    }
    .thumbs_img_wrapper{
        padding:0;
    }
    .thumbs_img_wrapper img{
        width: 111px;
        height: 70px;
        margin: 14px 0 0 14px;
    }
    #thumbs_img_1, #thumbs_img_4{
        margin: 14px 0 0 0;
    }

Finally my jquery

$(document).ready(function(){

$('img.big_img').hide(); // Hides all big images
$('img#big_img_1').fadeIn('slow'); // Serve as default image

$('img#thumbs_img_1').click(function(){
    $('img.big_img').hide(); // Hides all big images
    $('img#big_img_1').fadeIn('slow'); //Slowly fades in selected image
});

$('img#thumbs_img_2').click(function(){
    $('img.big_img').hide(); // Hides all big images
    $('img#big_img_2').fadeIn('slow'); //Slowly fades in selected image
});

$('img#thumbs_img_3').click(function(){
    $('img.big_img').hide(); // Hides all big images
    $('img#big_img_3').fadeIn('slow'); //Slowly fades in selected image
});
$('img#thumbs_img_4').click(function(){
    $('img.big_img').hide(); // Hides all big images
    $('img#big_img_4').fadeIn('slow'); //Slowly fades in selected image
});
$('img#thumbs_img_5').click(function(){
    $('img.big_img').hide(); // Hides all big images
    $('img#big_img_5').fadeIn('slow'); //Slowly fades in selected image
});
$('img#thumbs_img_6').click(function(){
    $('img.big_img').hide(); // Hides all big images
    $('img#big_img_6').fadeIn('slow'); //Slowly fades in selected image
});

});

I have a simple gallery that hides and shows images. It works fine, however, I am not satisfied with my approach, and my code seems redundant. Can you check my code and give a better idea on how I can improve it?

HTML

<div class="big_img_wrapper">
                <img src="<?= IMAGEPATH ?>front_page/phinfo/house_rentals/westgate/big_img_1.JPG" id="big_img_1" class="big_img">
                <img src="<?= IMAGEPATH ?>front_page/phinfo/house_rentals/westgate/big_img_2.JPG" id="big_img_2" class="big_img">
                <img src="<?= IMAGEPATH ?>front_page/phinfo/house_rentals/westgate/big_img_3.JPG" id="big_img_3" class="big_img">
                <img src="<?= IMAGEPATH ?>front_page/phinfo/house_rentals/westgate/big_img_4.JPG" id="big_img_4" class="big_img">
                <img src="<?= IMAGEPATH ?>front_page/phinfo/house_rentals/westgate/big_img_5.JPG" id="big_img_5" class="big_img">
                <img src="<?= IMAGEPATH ?>front_page/phinfo/house_rentals/westgate/big_img_6.JPG" id="big_img_6" class="big_img">
            </div>
            <div class="thumbs_img_wrapper">
                <img src="<?= IMAGEPATH ?>front_page/phinfo/house_rentals/westgate/thumbnails/thumbs_img_1.jpg" id="thumbs_img_1" calss="thumbs_img">
                <img src="<?= IMAGEPATH ?>front_page/phinfo/house_rentals/westgate/thumbnails/thumbs_img_2.jpg" id="thumbs_img_2" calss="thumbs_img">
                <img src="<?= IMAGEPATH ?>front_page/phinfo/house_rentals/westgate/thumbnails/thumbs_img_3.jpg" id="thumbs_img_3" calss="thumbs_img">
                <img src="<?= IMAGEPATH ?>front_page/phinfo/house_rentals/westgate/thumbnails/thumbs_img_4.jpg" id="thumbs_img_4" calss="thumbs_img">
                <img src="<?= IMAGEPATH ?>front_page/phinfo/house_rentals/westgate/thumbnails/thumbs_img_5.jpg" id="thumbs_img_5" calss="thumbs_img">
                <img src="<?= IMAGEPATH ?>front_page/phinfo/house_rentals/westgate/thumbnails/thumbs_img_6.jpg" id="thumbs_img_6" calss="thumbs_img">
            </div>

CSS

.big_img_wrapper, .big_img_wrapper img{
        width: 370px;
        height: 246px;
        /*display: none;*/
    }
    .thumbs_img_wrapper{
        padding:0;
    }
    .thumbs_img_wrapper img{
        width: 111px;
        height: 70px;
        margin: 14px 0 0 14px;
    }
    #thumbs_img_1, #thumbs_img_4{
        margin: 14px 0 0 0;
    }

jQuery

$(document).ready(function(){

    $('img.big_img').hide(); // Hides all big images
    $('img#big_img_1').fadeIn('slow'); // Serve as default image

    $('img#thumbs_img_1').click(function(){
        $('img.big_img').hide(); // Hides all big images
        $('img#big_img_1').fadeIn('slow'); //Slowly fades in selected image
    });

    $('img#thumbs_img_2').click(function(){
        $('img.big_img').hide(); // Hides all big images
        $('img#big_img_2').fadeIn('slow'); //Slowly fades in selected image
    });

    $('img#thumbs_img_3').click(function(){
        $('img.big_img').hide(); // Hides all big images
        $('img#big_img_3').fadeIn('slow'); //Slowly fades in selected image
    });
    $('img#thumbs_img_4').click(function(){
        $('img.big_img').hide(); // Hides all big images
        $('img#big_img_4').fadeIn('slow'); //Slowly fades in selected image
    });
    $('img#thumbs_img_5').click(function(){
        $('img.big_img').hide(); // Hides all big images
        $('img#big_img_5').fadeIn('slow'); //Slowly fades in selected image
    });
    $('img#thumbs_img_6').click(function(){
        $('img.big_img').hide(); // Hides all big images
        $('img#big_img_6').fadeIn('slow'); //Slowly fades in selected image
    });
});