Javascript image link does not work

Question

Okay, I know there are thousands of ways to do this(better and easier) but I’d just like to make it work. I am passing the images through the JS and would like to assign the link of the same, however, não funciona... The console does not return any error, someone could help ?

window.onload = function(){
    rdSocial = $("#social");

    var fb = '<img src="img/fb.png" value="1" class="img" onclick="redireciona(this);">';
    var twt = '<img src="img/twitter.png" value="2" class="img" onclick="redireciona(this);">';
    var insta = '<img src="img/insta.png" value="3" class="img" onclick="redireciona(this);">';

    rdSocial.innerHTML += fb;
    rdSocial.innerHTML += twt;
    rdSocial.innerHTML += insta;
}

function redireciona(obj){
    if(obj.value == "1"){
        window.location="#";
    }
}

Answer 1

You’re mixing up some concepts:

• jQuery and native Javascript

Use $('#social') will give you a jQuery object and not a DOM element where you can use it .innerHTML. Or seedlings to native using .getElementById(id) or switch to jQuery and use .html(conteudo)

• value is not an image property

The element <img> It is not by nature value. So it’s read as an attribute and to get it you have to use img.getAttribute('value').

Tip: Do it with native code:

window.onload = function(){
    rdSocial = document.getElementById("social");

    var fb = '<img src="img/fb.png" value="1" class="img" onclick="redireciona(this);">';
    var twt = '<img src="img/twitter.png" value="2" class="img" onclick="redireciona(this);">';
    var insta = '<img src="img/insta.png" value="3" class="img" onclick="redireciona(this);">';

    rdSocial.innerHTML += fb;
    rdSocial.innerHTML += twt;
    rdSocial.innerHTML += insta;
}

function redireciona(el){
    var value = el.getAttribute('value');
    if(value == "1"){
        window.location="#";
    }
}