CODEWITHSUNDEEP
javascriptjquery
user1427661
user1427661

Reputation: 11794

Converting a string into a jquery element and appending it to the DOM

I'm trying to do what the title says with the following (admittedly terribly written) code: 

$('.right').append($('<li class="btn log-out-button"><a data-method="delete" data-remote="true" format="json" href="' + data.log_out_path + '" class="standout-primary" rel="no-follow>Sign Out</a></li>

I can't for the life of me figure out what I'm doing wrong with it, but all that shows up is the following HTML:

<li class="btn log-out-button></li>

Why is it ignoring the inner HTML I wrote in my string?

Upvotes: 0

Views: 36

Answers (1)

The Alpha
The Alpha

Reputation: 146269

You have this code

$('.right').append($('<li class="btn log-out-button"><a data-method="delete" data-remote="true" format="json" href="' + data.log_out_path + '" class="standout-primary" rel="no-follow>Sign Out</a></li>

Missing barces/quotes, instead try this clean approach

var link = $('<a/>', {
    'data-method':'delete',
    'data-remote':'true',
    'format':'json',
    'href': data.log_out_path, // make sure you have 'data' in current scope
    'class':'standout-primary',
    'rel':'no-follow',
    'text':'Sign Out'
});
var li = $('<li/>', { 'class':'btn log-out-button' }).append(link);
$('.right').append(li);

An Example Here.

Upvotes: 1

Related Questions