Is it a good practice to create a sidebar using Javascript?

Is it a good practice to create a sidebar using Javascript?

A couple of months ago I realized I needed to update a sidebar annually
with a new link. Now instead of going through each page and inserting the
link (about 20 pages), I decided to create a javascript file and link it
to each page. The script would create links and append them to the page.
This meant that each time we needed to create a new link, we'd only need
to add a new line to the javascript file once and the change would be
reflected on each page. Essentially cutting down on time wasted going
through all pages and adding the new link. I wonder if this is a good
practice and could there be problems I failed to foresee?
The code is listed below:
function createVolume (text, link){
var volDiv = document.createElement("div");
var textDiv = document.createTextNode(text);
var linkDiv = document.createElement("a");
linkDiv.setAttribute("href", link);
volDiv.setAttribute("class", "volume");
volDiv.appendChild(textDiv);
linkDiv.appendChild(volDiv);
var d = document.getElementById("e27");
d.appendChild(linkDiv);
}
var bhbHome = createVolume("BHB Home", "bhb.html");
var v76 = createVolume("Volume 76", "bhb76.html");
var v75 = createVolume("Volume 75", "bhb75.html");
var v74 = createVolume("Volume 74", "bhb74.html");
var v73 = createVolume("Volume 73", "bhb73.html");
var v72 = createVolume("Volume 72", "bhb72.html");
var v71 = createVolume("Volume 71", "bhb71.html");
var v70 = createVolume("Volume 70", "bhb70.html");
var v69 = createVolume("Volume 69", "bhb69.html");
var v68 = createVolume("Volume 68", "bhb68.html");
var v67 = createVolume("Volume 67", "bhb67.html");
var v6566 = createVolume("Volume 65 and 66", "bhb_65_66.html");
var v64 = createVolume("Volume 64", "bhb64.html");
var v63 = createVolume("Volume 63", "bhb63.html");
var v626160 = createVolume("Volume 60, 61, and 62", "bhb_60_61_62.html");
var v59 = createVolume("Volume 59","bhb59.html");