Home/ Questions/Q 7765345
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-01T15:08:39+00:00

I want to create an external js-file, in which I can configure the copy

  • 0

I want to create an external js-file, in which I can configure the copy of several elements in my html file. I’m using document.getElementById(“id”).innerHTML = “what ever”; to “inject” or “add” my copy to html elements that have a certain id.

This works out fine, however when I have more than one element with the same id in my html file, the html from my js-file is only added to the first element but the html from my js-file should be added to all elements with the same id

That’s my html construct:

<html>
<head>
<script src="copy.js" type="text/javascript" charset="utf-8"></script>
<script src="jquery.js" type="text/javascript" charset="utf-8"></script>
</head>

<body>

<div>
<strong id="back-button"></strong>
</div>

....

<div>
<strong id="back-button"></strong>
</div>

</body>
</html>

And that’s my JS file:

$(function() {
    $(document).ready(function addcopy() {

        /* global */
        document.getElementById("back-button").innerHTML = "go back";
});
});

Any help or tip is much appreciated.
Thanks!

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You could use class, because ids can be used only once.

    <html>
<head>
<script src="copy.js" type="text/javascript" charset="utf-8"></script>
<script src="jquery.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<div class="back-button">
</div>
....
<div class="back-button">
</div>
</body>
</html>

    And in javascript :

    <script type="text/javascript">
     $(document).ready(function addcopy() {
         /* global */
         $(".back-button").html("<strong>go back</strong>");
     });
</script>
    • 0