move div up on mobile using push and pull bootstrap

I am trying yo move neweyes class using push and pull on mobile screen but I am unable to do that. How can I move upside this on mobile screen?

<div>
   <div class="woke-eye col-sm-12 col-md-4  col-sm-push-12">
      <img id="dani1">
   </div>
   <div class="neweyese  col-sm-12  col-md-8   col-sm-pull-12">
      <img src=''/>
   </div>

EDIT working fiddle

JSfiddle the wokeup eyes div should come later on mobile. now code is doing reverse , on large screen its coming later . but I need on mobile

Here's an example using your code, but modified so that it works the way you want.

<div>
  <div class="neweyese col-md-4 col-md-push-8">
    <img src=''/>neweyese
  </div>
  <div class="woke-eye col-md-8 col-md-pull-4">
    <img id="dani1">woke-eye
  </div>
</div>

You don't need col-sm-12, because that is the default behavior if you don't include it. Otherwise, we're essentially reversing the position of the two columns on MD and up. If the viewport is below MD, then the columns will switch to a width of 12 but since they are reversed the one on the right will be on top.

https://jsfiddle.net/6rtwyazq/12/