Home » Posts filed under JQuery Keywords

How to add text to div or division using jquery

in , , , , - on 06:03 - No comments

In the previous example, we have seen how to add anchor tag to body using JQuery AppendTo Keyword. In the example we are going to see, how to append text to existing division.

Main Code:

   $("<div class='NewClass'>Im new box by appendTo</div>").appendTo('#NewContent');


Complete Code:
<html>
<head>
    <title></title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
</head>
<body>

<div id='NewContent' style="color:Green"></div>
<script type="text/javascript">

   $("<div class='NewClass'>Im new box by appendTo</div>").appendTo('#NewContent');
</script>
</body>
</html>
 

Output:






How to add text to div using jquery


How to add text to div using jquery














                              Read more
                            















Labels:


                                  ,
                                


                                  ,
                                


                                  ,
                                


                                  ,
                                

















                            

                          

                          

                        

                          

                        







JQuery Append Keyword Example Code







                            in 
                            


                                , 
                              


                                , 
                              



                          - on 
                          05:35

                            - 
                            

                                No comments
                              






























Using this JQuery Append Keyword, we can able to Add the element to the existing DOM element with the deleting the previous content.






    <script type="text/javascript">
        $('#ranga').append("<b>jqueryexamplecode.blogspot.com</b>");
   </script>





Complete Code:




<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <title></title>

</head>
<body>
<div id="ranga"> <b>Ranga Rajesh Kumar -</b></div>

    <script type="text/javascript">
        $('#ranga').append("<b>jqueryexamplecode.blogspot.com</b>");
   </script>

</body>
</html>




Output:




JQuery Append Keyword Example Code


JQuery Append Keyword Example Code












                              Read more
                            















Labels:


                                  ,
                                


                                  ,
                                

















                            

                          

                          

                        

                          

                        







JQuery attr() Method Example Code







                            in 
                            


                                , 
                              


                                , 
                              



                          - on 
                          05:26

                            - 
                            

                                No comments
                              






























Using JQuery attr() method, we can able to add the attribute the DOM element. In the below example i have added the href attribute to the existing anchor tag.



Sample Code:




<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <title></title>

</head>
<body>
<a>Ranga</a>

    <script type="text/javascript">
        jQuery('a').text('JQueryExampleCode.blogspot.com').attr("href", "http://jqueryexamplecode.blogspot.com");
    </script>
</body>
</html>

 

Output:




JQuery attr() Method Example Code


JQuery attr() Method Example Code














                              Read more
                            















Labels:


                                  ,
                                


                                  ,
                                

















                            

                          

                          

                        

                          

                        







How to append Anchor tag to HTML Body Dynamically using jquery







                            in 
                            


                                , 
                              


                                , 
                              


                                , 
                              


                                , 
                              



                          - on 
                          05:57

                            - 
                            
5
                                comments
                              






























Using JQuery we can add anchor tag to body very easily. This can be possible by the AppendTo JQuery Method.



In the below example, i am appending anchor tag to body using jquery. We can also append div to any class or div using this Jquery AppendTo Keyword.



MainCode:






$('<a href="http://jqueryexamplecode.blogspot.com">JQueryExampleCode.blogspot.com</a>').appendTo('body');





Complete Code:




<html>
<head>
    <title></title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
</head>
<body>

<div id='NewContent' style="color:Green"></div>
<script type="text/javascript">
    $('<a href="http://jqueryexamplecode.blogspot.com">JQueryExampleCode.blogspot.com</a>').appendTo('body');

   
</script>
</body>
</html>






Output:




How to append Anchor tag to HTML Body Dynamically using jquery


How to append Anchor tag to HTML Body Dynamically using jquery












                              Read more
                            















Labels:


                                  ,
                                


                                  ,
                                


                                  ,
                                


                                  ,
                                























jQuery text() method example code







                            in 
                            


                                , 
                              


                                , 
                              



                          - on 
                          05:11

                            - 
                            

                                No comments
                              






























In most of the situations, we will use the JQuery text() method in the coding part. This JQuery text method will show the data from that particular element. This JQuery text method can concatenates the strings found in the elements of a wrapper set.






<html>
<head>
    <title></title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
</head>
<body>
    <div class="MyClass">
        Ranga
    </div>
    <div class="MyClass">
        Rajesh
    </div>
    <div class="MyClass">
        Kumar -- jqueryexamplecode.blogspot.com
    </div>

    <script type="text/javascript">
        alert($('.MyClass').text());
    </script>
</body>
</html>

 

Output:






jQuery text() method example


jQuery text() method example












                              Read more
                            















Labels:


                                  ,
                                


                                  ,