change between divs automatically

i'm trying to create a automatically photo changer in my web. i have a "mother" div that inside it i have another 3 divs(each div has his own id because of each one of them has a different background-image). what i want to do is to change between the "children" divs automatically (i don't care about the type f the animation). any idea how can i do it? here is my code

    <div id="main_pics" class="container">
    <!-- photos here -->
    <div id="main_photo1"></div>
    <div id="main_photo2"></div>
    <div id="main_photo3"></div>
    </div>

#main_pics{
margin-top: 57px;
width: 100%;
height: 500px;
}
#main_photo1{
width: 100%;
height: 500px;
background-image: url("1.jpg");
background-position: center center;
background-size: cover;
}

#main_photo2{
width: 100%;
height: 500px;
background-image: url("2.jpg");
background-position: center center;
background-size: cover;
}

#main_photo3{
width: 100%;
height: 500px;
background-image: url("3.jpg");
background-position: center center;
background-size: cover;
}

tanks!