JSF How to add a Hide/Show Toggle Javascript to subTable

JSF How to add a Hide/Show Toggle Javascript to subTable

I am running Rich Faces 3.x, and I have a subTable within a dataTable
which I would like to toggle the show/hide preferably using Java script.
What I have so far...
<rich:dataTable id="bookList_dt" [...]>
<rich:column>
<h:graphicImage id="expand" value="/images/expanded.gif"
onclick="toggleDetails(this);"/>
</rich:column>
<rich:column>
<f:facet name="header">ID</f:facet>
<h:outputText value="#{_item.bookId}"/>
</rich:column>
[...]
<rich:subTable value="#{_item.relatedVersions} var="_relatedItem"
id="relatedVersionsList">
<rich:column>
<f:facet name="header">ID</f:facet>
<h:outputText value="#{_relatedItem.bookId}"/>
</rich:column>
[...]
</rich:subTable>
</rich:dataTable>
And my JavaScript so far...
function toggleDetails(image) {
var detailsId = image.id.substring(0, image.id.lastIndexOf(':')) +
':relatedVersionsList';
var details = document.getElementById(detailsId);
if (details.style.display == 'none') {
details.style.display = 'block';
image.src = '#{minusIcon}';
} else {
details.style.display = 'none';
image.src = '#{plusIcon}';
}
Currently I get an error, stating that details is null