Removing document library buttons

Question

In my document library I have successfully hidden the Open In Explorer button by using the following code (code 1).

<script type="text/javascript"> 
  _spBodyOnLoadFunctionNames.push("hideToolbarItem()");    
  function hideToolbarItem() {   
    var doc = document.getElementsByTagName('ie:menuitem');      
    for (var i = 0; i < doc.length; i++){     
          itm = doc[i];
          if (itm.id.match('OpenInExplorer')!=null){
             itm.hidden=true;          
          }   
    }  
  } 
</script>

I now need to hide the Connect To Outlook button

I tried to get the code to refer to both menu buttons but that didn't work (code 2)

<script type="text/javascript"> 
     _spBodyOnLoadFunctionNames.push("hideToolbarItem()");
     function hideToolbarItem() {
       var doc = document.getElementsByTagName('ie:menuitem');
       for (var i = 0; i < doc.length; i++){     
       itm = doc[i];          
        if (itm.id.match('OpenInExplorer')!=null)  
        if (itm.id.match('OfflineButton')!=null){
             itm.hidden=true;          
}   
}  
} 
</script> 

Also using the same code twice doesn't work (code 3)

<script type = "text/javascript" >
    _spBodyOnLoadFunctionNames.push("hideToolbarItem()");
    function hideToolbarItem() {
        var doc = document.getElementsByTagName('ie:menuitem');
        for (var i = 0; i < doc.length; i++) {
            itm = doc[i];
            if (itm.id.match('OpenInExplorer') != null) {
                itm.hidden = true;
            }
        }
    }
</script>
<script type="text/javascript">
    _spBodyOnLoadFunctionNames.push("hideToolbarItem()");
    function hideToolbarItem() {
        var doc = document.getElementsByTagName('ie:menuitem');
        for (var i = 0; i < doc.length; i++) {
            itm = doc[i];
            if (itm.id.match('OfflineButton') != null) {
                itm.hidden = true;
            }
        }
    }
</script> 

Both codes 2 and 3 result in Open In Explorer re-appearing and Connect To Outlook dissapearing. I need both gone!I don't know much about Javascript so an explanation of where I'm going wrong would be appreciated :-)

Answer 1

Try using below:

<script type="text/javascript"> 

_spBodyOnLoadFunctionNames.push("hideToolbarItem()");    

function hideToolbarItem() {   
   var doc = document.getElementsByTagName('ie:menuitem');      
   for (var i = 0; i < doc.length; i++)   {     
       itm = doc[i];          
       if (itm.id.match('OpenInExplorer')!=null)  
       {             itm.hidden=true;          }
       if (itm.id.match('OfflineButton')!=null)        
       {             itm.hidden=true;          }   
   }  
}

</script> 

Answer 2

It is always a better approach to use the SharePoint Object Model for this type of thing, as opposed to hiding the physical HTML elements of the ribbon with JavaScript.

Here's a couple links to get you started (the second one specifically speaks to the "Open in Explorer" button):

http://www.learningsharepoint.com/2010/10/24/hide-ribbon-buttons-sharepoint-2010-programmatically/

http://sharepointegg.blogspot.com/2010/02/remove-button-from-ribbon-in-sharepoint.html