CODEWITHSUNDEEP
javascriptjqueryhtmlcss
Bangalore
Bangalore

Reputation: 1580

How to update text inside Div?

Iam trying to update Div text based on js variable null or not.

This is the code used for checking var userName is null or not. If its null i dont want to do anything.But if userName is not null then i need to append ',' to existing text inside div .

 $("document").ready(function (){
    var userName = "";
    if (userName == undefined || userName == null) {
        alert('empty');
    } else {
        alert('not empty');
        var div = document.getElementById('title b');
        div.innerHTML = div.innerHTML + ','; 
    }
});

my html of the div

<div id="title" class="box">
<b>Welcome</b>
</div>

For example if userName is not null then i want div text as "Welcome ,"

if userName is null then i want div text as "Welcome"

Upvotes: 0

Views: 253

Answers (3)

Gavin42
Gavin42

Reputation: 490

A more jQuery answer, if you are interested:

var userName = "";
//var userName = "User";   // for testing
//var userName;            // for testing
//var userName = null;     // for testing

$(document).ready(function (){
    var greeting = !!userName ? "Welcome, "+ userName + "!" : "Welcome";

    $("#title b").html(greeting);
})

jsFiddle

Upvotes: 0

Rory McCrossan
Rory McCrossan

Reputation: 337560

You're using an odd mix of POJS and jQuery here. Here's a purely jQuery solution:

$("document").ready(function (){
    var userName = "";
    if (userName == undefined || userName == null) {
        alert('empty');
    } else {
        alert('not empty');
        $('#title b').append(','); 
    }
});

It's a little odd that you're declaring userName as an empty string within your function - the first if condition will never execute.

Upvotes: 1

Chris Dixon
Chris Dixon

Reputation: 9167

Since you're using jQuery already...

 $(document).ready(function (){
    var userName = ""; // this will never get into the following if statement, always else

    if (userName == undefined || userName == null) { // use if (!userName) as shorthand.
        alert('empty');
    } else {
        alert('not empty');
        var div = $('#title > b');
        div.text(div.text() + ','); 
    }
});

Upvotes: 2

Related Questions