jquery Archives - Page 2 of 2

Changing text on mouse over event

January 12, 2023January 11, 2023 by manish

Change text of html element on mouseover and on mouseleave event it should show original message. Example

<div id="message">
 Hi How are you
</div>

Hi How are you

</div>

$(document).ready(function() {
      $(document).on('mouseover', '#message', function(event) {
        event.preventDefault();
        $("#message").text("I am fine");
    }).on('mouseleave', '#message', function(event) {
        event.preventDefault();
        $("#message").text("Hi How are you");
    });
});

$(document).ready(function() {

$(document).on('mouseover', '#message', function(event) {

event.preventDefault();

$("#message").text("I am fine");

}).on('mouseleave', '#message', function(event) {

event.preventDefault();

$("#message").text("Hi How are you");

});

Output:

Javascript jquery checkbox checked, unchecked, ischecked

January 12, 2023January 10, 2023 by manish

Here we will see the Javascript jquery checkbox checked and unchecked and ischecked examples. Input type checkbox How to create input checkbox in HTML.. for this, we have to use the input type checkbox. along with type we used other attributes line name value and id.

 <input type="checkbox" name="hobby" value="music" id="ck1">    Music

1	<input type="checkbox" name="hobby" value="music" id="ck1"> Music

Jquery checkbox checked To select check boxes $(“#ck1”).prop(“checked”,true); … Read more

Jquery remove element : remove text HTML div image table

January 12, 2023January 10, 2023 by manish

Jquery remove element is a way to remove an element from DOM. Jquery remove element on button click The remove() is very useful to remove the elements

<!DOCTYPE html>
<html>
    <head>
        <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    </head>
    <body>
        <h2>Example of Jquery Remove()</h2>
        <p>Remove this line</p>
        <button>Remove Paragraph</button>
        <script>
            $( "button" ).click(function() {
              $( "p" ).remove();
            });
        </script>
    </body>
</html>

<!DOCTYPE html>

<html>

<head>

</head>

<body>

<h2>Example of Jquery Remove()</h2>

<p>Remove this line</p>

<button>Remove Paragraph</button>

$( "button" ).click(function() {

$( "p" ).remove();

});

</script>

</body>

</html>

How to remove Jquery element by class To remove any class in html remove() is used. In following example class two is removed on button click event. … Read more