css – every 3 elements after three

Question:

Good evening everyone. Has a parent who has many children

<div class="parent">
    <div class="child"></div>//green
    <div class="child"></div>//green
    <div class="child"></div>//green
    <div class="child"></div>
    <div class="child"></div>
    <div class="child"></div>
    <div class="child"></div>//green
    <div class="child"></div>//green
    <div class="child"></div>//green
    <div class="child"></div>
    <div class="child"></div>
    <div class="child"></div>
    <div class="child"></div>//green
    <div class="child"></div>//green
    //и т. д.
</div>

How to use css to make every 3 elements in three green?

Answer:

I just came up with this

.child {
    display: block;
    height: 20px;
    width: 30px;    
    background-color: #CCCCCC;    
    margin: 2px;
}
.parent div:nth-child(6n-3), .parent div:nth-child(6n-4), .parent div:nth-child(6n-5) {
    background-color: #00CC00;    
}

Example here http://jsfiddle.net/046xsfLk/