[SOLUCIONADO] Boostrap cambiar orden de las colunas

[moscrates]

Hola, estoy intentando cambiar el orden de las columnas cuando este en dispositivos pequeños y no me queda

en grandes se ve:

[6 Rojo][6 Azul]
cuando se hace pequeño queda
[12 Rojo]
[12 Azul]

Lo que necesito hacer es que cuando este pequeño se vea
[12 Azul]
[12 Rojo]

lo he intentando con pull y push pero eso solo funciona cuando entre los dos div ocupan las 12 columnas

Código HTML:

<div class="col-xs-12 col-sm-12 col-md-6 col-lg-6 col-sm-pull-12 col-xs-pull-12">
Rojo
</div>
 
<div class="col-xs-12 col-sm-12 col-md-6 col-lg-6 col-sm-pull-12 col-xs-pull-12">
Azul
</div>
 

[xfxstudios]

el azul no te va a quedar arriba del rojo si no es el oreden que les das, si primero tienes el div rojo el sistema assume que va arriba del azul

[AngelKrak]

Podrias hacerlo con AppendTo de Jquery, asi moverias el rojo para abajo, o creo que si lo haces con tablas tambien funciona poniendole table-footer-group al rojo jejeje xD