CODEWITHSUNDEEP
javascriptjqueryhtml
Kumaresan Perumal
Kumaresan Perumal

Reputation: 131

how to append html after document loading using jquery in html?

I get an username from jsp. assigned it to a variable. then, When I try to append this html on .linkUser class. It is not adding. why I do not know. please help me with it.

JS:

    <script defer>
        var signedUserId ="${app.user.id}";   
           console.log('signedUserId ...' + signedUserId);
           if(signedUserId == null || signedUserId == "" || signedUserId == undefined){
               signedUserId = "${signedUserID}";
           }


            var userName = "${user.firstName}";  
            var userNameHtml = "";
             if(userName == "" || userName == undefined || userName == null){
                userName = "${signedUserName}";
                userNameHtml += "Hi, "+userName+" <span class=\"caret\"></span>";
                //$(".linkUser").html(userNameHtml);
                $( ".linkUser" ).after( userNameHtml );
                console.log('true ****** ');
            }else{
                userNameHtml += "Hi, "+userName+" <span class=\"caret\"></span>";
                $(".linkUser").after(userNameHtml);
            }
    <script>

HTML:

    <li class="li-user dropdown">
                                    <a id="anchor" class ="linkUser" title="" href="javascript:void(0);" data-toggle="dropdown" 
                                    aria-haspopup="true" aria-expanded="false"> </a>
                                    <ul class="dropdown-menu" aria-labelledby="linkUser">
                                        <li><span class="caret"></span><span class="caret"></span>
                                        <a id = "anchor" title="" onclick="profile()" href="#"> View Profile <span class="icon icon-profile"></span> </a></li>

                                        <li><a id = "anchor" title="" href="#">Settings <span class="icon icon-settings"></span></a></li>
                                        <li><a id = "anchor" title="" href="javascript:zimidyLogout();">Sign Out <span class="icon icon-sign-out"></span></a></li>
                                    </ul>
                                </li>

Upvotes: 1

Views: 87

Answers (1)

Samudrala Ramu
Samudrala Ramu

Reputation: 2106

   Put Your Code In Document Ready State 
    <script defer>
    $(document).ready(function(){
    var signedUserId ="${app.user.id}";   
    console.log('signedUserId ...' + signedUserId);
    if(signedUserId == null || signedUserId == "" || signedUserId == undefined){
        signedUserId = "${signedUserID}";
       }
    var userName = "${user.firstName}";  
    var userNameHtml = "";
    if(userName == "" || userName == undefined || userName == null){
       userName = "${signedUserName}";
       userNameHtml += "Hi, "+userName+" <span class=\"caret\"></span>";
       //$(".linkUser").html(userNameHtml);
       $( ".linkUser" ).after( userNameHtml );
       console.log('true ****** ');
       }else{
            userNameHtml += "Hi, "+userName+" <span class=\"caret\"></span>";
       $(".linkUser").after(userNameHtml);
       }
       });

<script>

Upvotes: 4

Related Questions