Target an image in Jquery

Question

I need to target just the image, the only problem is is that the image is set as a background on the class "hero1project3". I need it to stay in this class, is there a way in my jquery that I can tell just the image to blur for example ".hero1project3 img"

HTML:

 <div class="hero1project3">
     <div class="blur">
 </div>

 <div id="hero1titleproject1">
     <h1>Information Design: <br>Zumerset Cyder Appl's.</h1>
 </div>

Jquery:

$(document).scroll(function(){
    if($(this).scrollTop() >0){
        $('#hero1titleproject1').css({'webkit-filter':'blur(5px)', 'filter':'blur(5px)'});
    } else {
        $('#hero1titleproject1').css({'webkit-filter':'', 'filter':''});
    }
});

CSS:

.hero1project3 {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:url(../Information_Design_Zumerset_Project3_hero.jpg);
    background-position:50%;
    background-size:cover;
    transition:all .5s
}

div.project.project3img2 {
    background-color: rgb(255,255,255);
}

Answer 1

Using img as a selector means you are trying to select an img tag underneath hero1project3, which does not exist since you are using a background image set via CSS to .hero1project3.

See this answer to know how to blur a background image: How to apply a CSS 3 blur filter to a background image