Found 10711 Articles for Web Development

How to find an element based on a data-attribute value using jQuery

Amit D
Updated on 13-Feb-2020 09:23:08

3K+ Views

To find an element based on a data-attribute value using jQuery is quite easy. Try to run the following code to find an element based on a data-attribute value −ExampleLive Demo    $(document).ready(function() {      $('[data-slide="0"]').addClass('demo');    }); .demo {     font-size: 150%;     color: red; } Rocky Amit John

How can I get the ID of an DOM element using jQuery?

Arnab Chakraborty
Updated on 22-Jun-2020 07:55:54

567 Views

In jQuery attr method is use to get the id attribute of the first matching element.$("btn1").attr("id")In your exampleExample iddom                 $(document).ready(function () {          $('#btn1').click(function () {             alert( $('#test').attr('id'));          });       });                   Click Here

How to get selected text from a drop-down list (select box) using jQuery?

Ricky Barnes
Updated on 12-Jun-2020 12:50:48

810 Views

With jQuery, it’s easy to get selected text from a drop-down list with :selected. This is done using the select id. You can try to run the following code to learn how to get selected text from a drop-down list using jQuery −ExampleLive Demo           jQuery Selector                      $(document).ready(function() {             $("#submit").click(function(){                      $("#myselection option:selected").text();                alert( $("#myselection option:selected").text() );             });          });                              The selected value:                   First           Second                 Result              

How can I know which radio button is selected via jQuery?

Ricky Barnes
Updated on 13-Feb-2020 07:37:01

183 Views

Use the jQuery val() method to get the value of the selected radio button. You can try to run the following code to learn how to know which radio button is selected via jQuery −ExampleLive Demo           jQuery Selector                      $(function(){            $("#submit").click(function(){                     alert($('input:radio:checked').val());           });          });                              Select a number:          1          2          3          Result          

How do I check if an element is hidden in jQuery?

Ricky Barnes
Updated on 12-Jun-2020 12:48:51

134 Views

Using jQuery, you can detect if a specific element in the page is hidden or visible with is(:visible). You can try to run the following code to learn how to check if an element is hidden in jQuery or not −ExampleLive Demo           jQuery Selector                      $(document).ready(function() {          $("#button1").click(function(){            var visible = $('#myElement').is(':visible');                      if(visible) {               alert("input element is visible");                    }            else            {               alert("input element is hidden");            }          });         });                                     Check Visibility    

How can I select an element by its ID attribute using jQuery?

Ricky Barnes
Updated on 12-Jun-2020 12:46:54

320 Views

The element ID selector selects a single element with the given id attributes. Here’s how you can select:$('#elementid')You can try to run the following code to learn how to select an element by its ID attribute using jQuery:Live Demo           jQuery Selector                      $(document).ready(function() {             $("#div2").css("background-color", "yellow");          });                              This is first division of the DOM.                      This is second division of the DOM.                      This is third division of the DOM          

How to select element with specific class and title attribute using jQuery?

Ricky Barnes
Updated on 13-Feb-2020 07:33:37

2K+ Views

If your element is having a class and title attribute, still you can select it with jQuery. You can try to run the following code to learn how to select element with specific class and 'title' attribute using jQuery.ExampleLive Demo           The Selector Example                          $(document).ready(function() {             $(".big[title='one']").css("background-color", "yellow");          });                                          This is first division of the DOM.                        This is second division of the DOM.              

How can I select an element by its class name using jQuery?

David Meador
Updated on 12-Jun-2020 12:40:18

629 Views

The element class selector selects all the elements which match with the given class of the elements. Use the css() method to change the background color.You can try to run the following code to learn how to select an element by its class name using jQuery:Live Demo           jQuery Selector                          $(document).ready(function() {             $(".big").css("background-color", "yellow");          });                                  This is first division of the DOM.                      This is second division of the DOM.                      This is third division of the DOM              

How can I select an element with multiple classes in jQuery?

David Meador
Updated on 12-Jun-2020 12:31:14

557 Views

To select an element with multiple classes, do the following. Here, x, y, and z are our classes,$('.x.y.z')You can try to run the following code to learn how to select an element with multiple classes in jQuery:Live Demo           jQuery Selector Example                          $(document).ready(function() {             $(".one.two").css("background-color", "grey");          });                                  This is first division of the DOM.                      This is third division of the DOM              

How can I select an element by tag name using jQuery?

David Meador
Updated on 13-Feb-2020 07:28:34

1K+ Views

Using jQuery selector, you can select an element by tag name. The jQuery element selector selects elements.ExampleTry to run the following code to learn how to select an element by tag name using jQuery −Live Demo           jQuery Selector Example                          $(document).ready(function() {             $("div").css("background-color", "yellow");          });                                  This is first division of the DOM.                      This is second division of the DOM.                      This is third division of the DOM              

Advertisements