When I click I want an img tag to be generated and with an image I have tried several ways but it doesn't work.
var oferr=document.getElementsByClassName("a")[0];
var new=document.getElementsByClassName("create")
oferr.addEventListener('click', function () {
let new_element=document.createElement('img');
let image=document.createAttribute('src','img/imagen_1');
new_element.appendChild(imagen);
new.appendChild(new_element);
}) <div class="ad">
<h1>10% discount</h1>
</div>
<header>
<div class="logo">
<h2 class="name">Environments</h2>
</div>
<nav>
<a href="" class="nav-link">Offers</a>
<a href="" class="nav-link">Products</a>
<a href="" class="nav-link">Login</a>
</nav>
</header>
<div id="create">
</div>
<script src="/js/main.js"></script>Just set the image's .src property to the source URL.
create is an ID, not a class, so use document.getElementById().
The anchors don't have class="a", you should use document.getElementsByClassName("nav-link").
You need to use Event.preventDefault() in the event listener to prevent following the links.
You can't use new as a variable name because it's a reserved keyword.
var oferr=document.getElementsByClassName("nav-link")[0];
var create=document.getElementById("create")
oferr.addEventListener('click', function (e) {
e.preventDefault();
let new_element=document.createElement('img');
new_element.src = 'img/imagen_1';
create.appendChild(new_element);
})<div class="ad">
<h1>10% discount</h1>
</div>
<header>
<div class="logo">
<h2 class="name">Environments</h2>
</div>
<nav>
<a href="" class="nav-link">Offers</a>
<a href="" class="nav-link">Products</a>
<a href="" class="nav-link">Login</a>
</nav>
</header>
<div id="create">
</div>
<script src="/js/main.js"></script>