MonkeyOnARock MonkeyOnARock - 1 month ago 6
jQuery Question

jQuery 'text' not working

var $insertSuccessMessage = $('#insertSuccessMessage');
var $successPopup = $('#successPopup');
var $successSpan = $('#successSpan');


I have a div tag:

<div id="insertSuccessMessage"></div>


When a user successfully enters a value into an input field, I am trying to get a 'success' popup to appear beneath this div tag like so:

$insertSuccessMessage.append('<div class="alert alert-success alert-dismissible" id='successPopup' role="alert"><button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button><span id="successSpan"></span></div>');
$successSpan.text("Successfully inserted value!");


Side: I'm using Bootstrap.

So the
successPopup
will appear, but the text won't; the text is not inserted in between the span tags.

Answer

You aren't defining $successSpan. You need to use $('#successSpan') to access the element by ID

Update after your edit:

You are defining $successSpan too early. When you define it, the #successSpan element doesn't exist yet.

Comments