Execute function based on screen size

Question

I need to execute a specific function based on screen size and screen size changes (Responsive)

So lets say I have 3 functions (For Example)

function red() {
    $('div').css('background','#B60C0C')
    .text('Screen Size RED');
    console.log('RED');
}

function orange() {
    $('div').css('background','#EBAE10')
    .text('Screen Size ORANGE');
    console.log('ORANGE');
}

function green() {
    $('div').css('background','#83ba2b')
    .text('Screen Size GREEN');
    console.log('GREEN');
}

I need to execute function green() when the screen width size 500px or lower

And function orange() when the screen width size 501px to 850px

And function red() when the screen width size 851px or higher

I tried to use resize() but the problem is executing the function when resizing the browser for each pixel repeat executing the same function and this is a very bad way to perform

I need to execute the function when break the point of the screen width size

Ready to use code on jsfiddle http://jsfiddle.net/BaNRq/