jquery - javascript media query - loading HTML elements -

i want html element (<p>html element</p>) load on page when screen size above width.

i don't want hidden; want removed entirely when screen size below 600, , loading when screen size above 600.

i tried

if (window.matchmedia('screen , (min-width: 600px)')){    $('body').append('<p>html element</p>'); } 

but it's not working me. clues?

window.matchmedia() returns object, need check matches property:

if (window.matchmedia('screen , (min-width: 600px)').matches){...}