Adding onclick href for a dynamically created nested div

Question

In this case I am not able to escape the quotes I think.

I am trying this from last one day

var obj = deals[i]; 
var1 = "my var"
var url =  "index.html?name="+obj['a']+"&user="+var1+"+obj['a'];

var div = document.createElement('div');
div.innerHTML = '<div style="width: 100%; overflow: hidden" >' +
'<div style="width: 10%; float: left;" >' +
'<div><img src="assets/img/userimg.png" style="height: 35;margin-left: 10; margin-right: 5px;"/></div> <div id="toro" style="color: black">' +  obj['a'] + '</div>' +
 '</div>' +
 '<div style="margin-left: 25%;">' +
 '<div style="margin-top: 7;font-weight: bold; color: black">' +obj['b']+'</div> <div style="color: black" >' + '</div><div style="float: right" id="time">'+'</div></div></div> '+'<hr class=\"hr-clas-low\" />';

  document.getElementById('deals').appendChild(div)

How do I add the url as onclick href url to the newly created div?

OK I am rewriting this question again to convey where I am stuck exactly

var obj = deals[i]; 
var1 = "my var"
 var url =  "index.html?name="+obj['a']+"&user="+var1+"+obj['a'];




var div = document.createElement('div');
div.innerHTML = '<div style="width: 100%; overflow: hidden"    onclick="location.href='+url+'>' +
'<div style="width: 10%; float: left;" >' +
'<div><img src="assets/img/userimg.png" style="height: 35;margin-left:    10; margin-right: 5px;"/></div> <div id="toro" style="color: black">' +        obj['a'] + '</div>' +
'</div>' +
'<div style="margin-left: 25%;">' +
'<div style="margin-top: 7;font-weight: bold; color: black">'       +obj['b']+'</div> <div style="color: black" >' + '</div><div style="float:       right" id="time">'+'</div></div></div> '+'<hr class=\"hr-clas-low\" />';

document.getElementById('deals').appendChild(div)

I have added onclick="location.href='+url+' to the external div but its not working?

Re: quotes - see: http://stackoverflow.com/questions/2004168/escape-quotes-in-javascript — Shog9, Dec 25 '16 at 16:00
sir I have been trying everything I get from yesterday, but it just dont works, I have provided my code , my url, if you plz answer my question then I will accept it — Ritzor, Dec 25 '16 at 16:04
We can't provide you with assistance if we don't know where you're having trouble; there are two links provided now for help with event binding and quote escaping; honestly you may be better served doing a bit of reading on how to create elements dynamically though. — Shog9, Dec 25 '16 at 16:28
I tried this var url = "index.html?name="+obj[a']+"&n="+nam; '
' + — Ritzor, Dec 25 '16 at 16:29
getting this Uncaught SyntaxError: Invalid or unexpected token — Ritzor, Dec 25 '16 at 16:30
@praveen I need inline html solution as I am going to have multiple of these divs created dynamically inside a for loop — Ritzor, Dec 25 '16 at 17:47
can you plz help me with escaping required characters in this implementation — Ritzor, Dec 25 '16 at 17:49
did you close that double quote? You wrote `onclick="location.href='+url+'>'`, but it should be `onclick="location.href='+encodeURI(url)+'">'` — animaacija, Dec 25 '16 at 20:21
You have at least 2 double quotes opened an not closed in your code: 1- in this line: `var url = "index.html?name="+obj['a']+"&user="+var1+"+obj['a'];` and 2- in this line: `div.innerHTML = '
' `. Please first fix them and then if you had more problems, please write in which line what error you are getting... — EhsanT, Dec 25 '16 at 21:19
@animaacija, it says Uncaught SyntaxError: Unexpected identifier and points at — Ritzor, Dec 26 '16 at 05:22

score 0 · Answer 1 · answered Dec 25 '16 at 22:23

The only error i see in this code is in the three first lines:

var obj = deals[i]; 
var1 = "my var"
 var url =  "index.html?name="+obj['a']+"&user="+var1+"+obj['a'];

I think it should be:

var obj = deals[i]; 
var1 = "my var";
var url =  "index.html?name="+obj['a']+"&user="+var1+obj['a'];

Then:

div.innerHTML = '<div style="width: 100%; overflow: hidden" onclick="location.href='+url+'"><div style="width: 10%; float: left;" ><div><img src="assets/img/userimg.png" style="height: 35;margin-left: 10; margin-right: 5px;"/></div><div id="toro" style="color: black">'+obj['a']'+</div></div><div style="margin-left: 25%;"><div style="margin-top: 7;font-weight: bold; color: black">'+obj['b']+'</div><div style="color: black" ></div><div style="float: right" id="time"></div></div></div><hr class="hr-clas-low" />'

Should work just fine

Adding onclick href for a dynamically created nested div

1 Answers1