按需设置div背景图像

Question

我正在尝试在android中设置div的背景图像，但是当我运行我的代码时它不起作用...... 我正在使用android来测试它。当我通过css设置背景图像时：

#defaultHeader {
    height: 65px;
    width:   100%;
    background-image: url('../img/imgSizes/header-640x960.jpg');
    background-size: 100% 100%;
    background-repeat:no-repeat;
}

它有效，但是当我尝试按需提供时它不会......

function setHeaderLogo(){
    var size = getWindowScreenSize();
    var path = "../img/imgSizes/" + "header-" + size + ".jpg";
    $('#phoneHeaders #defaultHeader').css("background-image", "url(" + path + ")");  
    $('#phoneHeaders #defaultHeader').css("background-image", "100% 100%");
    $('#phoneHeaders #defaultHeader').css("background-repeat", "no-repeat");
}

包含它的div看起来像：

<div id="header">
    <div id="phoneHeaders">
        <div id="defaultHeader">
        </div>
    </div>
    <div id="tabletHeaders">
        <div id="defaultHeader">
            Default Tablet Header
        </div>
    </div>
</div>

在html文件的末尾：

<script type="text/javascript">
    $(document).ready(function(){
        setHeaderLogo();
    })
</script>

我真的已经尝试过了......我不知道为什么它不起作用..