how to put if condition in jquery's append function - jquery-ui

Question

i have trapped in a jquery function, all i want is to append some divs using jquery's append function, but the problem is that i want to put some if conditions in this function,
here is my working code without condition
$( "#some-div-container" ).append(
"<div>name 1" +
"<a href=\"#\">" +
"<div id=\"add\">Add</div>" +
"</a>" +
"<div>Available</div>" +
"</div>"
);
i am using jquery's ajax function having some json response, so i want just that, let say if(response == 1) then execute the code inside it, i am trying using condition,
$( "#some-div-container" ).append(
"<div>name 1"
if(response == 1) {
+"<a href=\"#\">" +
"<div id=\"add\">Add</div>" +
"</a>"
}
+ "<div>Available</div>" +
"</div>"
);
is it possible?
Any help will be appreciated, an error occured when i put this condition "my some other javascript function is not defined", works perfect without condition

Answer 1

Build your string beforehand, by using a variable:
var elements = "<div>";
if (someCondition) {
elements += "<a href='#'>some link</a>";
}
elements += "</div>";
Or, a more specific example:
var elements = "<div>name 1";
if(response == 1) {
elements +=
"<a href='#'>" +
"<div id='add'>Add</div>" +
"</a>";
}
elements += "<div>Available</div>";
elements += "</div>";
Then append the resulting string:
$("#some-div-container").append(elements);

Answer 2

You could acheive that in the following manner:
$('#some-div-container').append(
'<div>name 1' +
(response == 1 ? '<div id="add">Add</div>' : '') +
'<div>Available</div></div>'
);
Demo
But I think it would be neater to do something like this
var div = $('<div/>', { text: 'name 1' });
if(response == 1) {
div.append($('<a/>', { href: '#' }).append($('<div/>', { id: 'add', text: 'Add' })));
}
$('<div/>', { text: 'Available' }).appendTo(div);
div.appendTo('#some-div-container');
Demo

Answer 3

Try this :
$( "#some-div-container" ).append(
"<div>name 1"
+ (
response == 1 ?
"<a href=\"#\">" +
"<div id=\"add\">Add</div>" +
"</a>"
:
""
)
+ "<div>Available</div>" +
"</div>"
);

Answer 4

Create different strings based on the value of response, and do a single append() call with the conditioned string.

Answer 5

var html;
html += "<div>name 1";
if(response == 1) {
html += "<a href=\"#\">";
// other code.....
}
$( "#some-div-container" ).append( html );