I have a problem creating a new image element to this code here:
<a href="/sound-packs/" data-link-title="Sound Packs">Sound Packs</a>
Unfortunately, I do not have access to the HTML code because it belongs to a locked template of "jimdo". I can only insert CSS codes and javascript in the "head area". Is there a way to add an image element to this HTML code with javascript?
Yes, there is a way to do this using just javascript. Firstly you need to set the window.onload callback to a function. Within this function, you can then get the element you want to add the image to. Here I added the image to the element with the attribute data-link-title which is equal to "Sound Packs".
Lastly, you can use .innerHTML on this element to add the HTML you want to add within this element. Here I added a <br /> followed by an <img> tag:
document.body.onload = function() {
let soundPacks = document.querySelector('[data-link-title="Sound Packs"]');
soundPacks.innerHTML += "<br /><img src='https://cdn.sstatic.net/Sites/stackoverflow/company/img/logos/so/so-icon.png?v=c78bd457575a' alt='StackOverflow Logo'/>";
}<a href="/sound-packs/" data-link-title="Sound Packs">Sound Packs</a>
document.body.onload instead of window.onload might help a little. Unfortunately, the part you want to append the image to doesn't have a class or id and thus it takes a little time to append the item...document.body.onload won't work with "Jimdo". window.on.load works but the image still appears after the content is loaded :( Right next to "Sound Packs" I have two more links I want to add an image to. Same Coder like "Sound Packs" with "data-link-title" "Apps" and "Comments. If I clone your code and do the same thing for "Apps" it show the image right to the "Apps" font but then the image for "Sound Packs" disappears! Do you know why?