Javascript：如何设置子div的样式

我有几个div嵌套在父div中。当我在谷歌地图上单击一个自定义按钮时，它会将一个div向右滑动，并在另一个div向左滑动。不过，这样做的目的是将按钮移出屏幕，使其失去焦点，您可以访问位于屏幕右下角的按钮。我试图做的是与之抗争如下。设置负的边距可以将这些div拉回到焦点，但它不起作用

document.getElementById('alert-list').style.width = "403px";
document.getElementById('map-wrapper').style.marginLeft = "403px";
document.getElementById('mapBtns').style.marginLeft = "-403px";
document.getElementById('mapAds').style.marginLeft = "-205px";

“警报列表”是从左侧滑入的div。“地图包装器”滑向右侧403px，如上图所示，以便为左侧滑入的div（警报列表）腾出空间。当页面加载或点击地图上的按钮时，所有这些都非常有效。我的问题是“mapBtns”“mapAds”，它嵌套在“map wrapper”中。我开始对此进行故障排除，发现它们都嵌套在一个div调用“container”中。“mapBtns”“mapAds”嵌套在“map wrapper”中。现在奇怪的是，当我在控制台中查看元素时，我可以看到javascript函数中的样式被应用到这些div，就像我内联看到的那样，但是，“mapBtns”“mapAds”没有响应屏幕上的样式更改

我是否还需要做一些其他事情来应用我缺少的或没有正确执行的这些样式？以下是完整的功能

function openAlerts() {
    document.getElementById('alert-list').style.width = "403px";
    document.getElementById('map-wrapper').style.marginLeft = "403px";
    document.getElementById('mapBtns').style.marginRight = "-403px";
    document.getElementById('mapAds').style.marginRight = "-205px";
}

编辑

经过进一步的调查和排除故障后，我想我已经缩小了冲突的范围。只是不确定如何解决它，因为我对javascript还不够了解。在我的Google Maps代码中，我有以下内容，将按钮放置在地图上。这覆盖了“mapBtns”定义的任何CSS“.我只是不知道如何克服这个问题

// Load the map fullscreen collapse top button   
   var fullScreen = document.getElementById('fullscreen');
        map.controls[google.maps.ControlPosition.RIGHT_TOP].push(fullscreen);

        google.maps.event.addListenerOnce(map, 'tilesloaded', function() {$('#fullscreen').delay(1000).fadeIn("slow");});

   // Load the map control buttons     
    var mapControl = document.getElementById('controls');
         map.controls[google.maps.ControlPosition.RIGHT_BOTTOM].push(mapControl);

         google.maps.event.addListenerOnce(map, 'tilesloaded', function() {$('#controls').delay(1000).fadeIn("slow");});

---

这是纯js，不涉及jquery——你不需要在HTML上贴标签please@Gonzalo.-这可能仍然意味着他愿意接受jquery的答案