Usando `jquery`: <!-- begin snippet: js hide: false console: true babel: false --> <!-- language: lang-js --> $("#newimg").css({ WebkitFilter: 'grayscale(100%) brightness(0%)' }) <!-- language: lang-html --> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <img src="https://i.sstatic.net/JJ6Vs.png" id="originalimg"/> <br> <img src="https://i.sstatic.net/JJ6Vs.png" id="newimg"/> <!-- end snippet --> Usando `css`: <!-- begin snippet: js hide: false console: true babel: false --> <!-- language: lang-css --> #newimg { -webkit-filter: grayscale(100%) brightness(0); /* Safari 6.0 - 9.0 */ filter: grayscale(100%) brightness(0); } <!-- language: lang-html --> <img src="https://i.sstatic.net/JJ6Vs.png" id="originalimg"/> <br> <img src="https://i.sstatic.net/JJ6Vs.png" id="newimg"/> <!-- end snippet -->