To wrap two adjacent elements, loop through each myclass, add it to array and determining the next element has a .myclass. You can try to run the following code to learn how to wrap two adjacent elements in a containing div −ExampleLive Demo $(document).ready(function() {     var result = [];         $('.myclass').each(function() {         var box2 = $(this).next().hasClass('myclass');                 result.push($(this));                 if(!box2)         {             var container = $('');             container.insertBefore(result[0]);             for(x=0;x

The best way to add DOM elements with jQuery is to append the HTML string, using append() method. You can try to run the following code to insert DOM element −ExampleLive Demo           The jQuery Example                              $(document).ready(function() {             $("div").click(function () {                $(this).append('' );             });          });                              .div {             margin:10px;             padding:12px;             border:2px solid #666;             width:60px;          }                             Click on any square below to see the result:                                      

To select an element by name with jQuery, use the name element for the input field. You can try to run the following code to select element by name −ExampleLive Demo $(document).ready(function(){   $("#button1").click(function(){      var sname = jQuery("#form1 input[name=sub]").val();      alert(sname);   }); });   Subject Name: Get

To manipulate CSS pseudo elements using the hover() function. You can try to run the following code to learn how to manipulate CSS pseudo-elements −ExampleLive Demo $(document).ready(function(){     $('span').hover(function(){     $(this).addClass('change').attr('data-content','bar'); }); }); span.change:after {     content: attr(data-content) ' This is demo text.'; } Place cursor below... foo

To handle jQuery AJAX error. The ajaxError( callback ) method attaches a function to be executed whenever an AJAX request fails. This is an Ajax Event.Here is the description of all the parameters used by this method −callback − The function to execute. The XMLHttpRequest and settings used for that request are passed as arguments to this function. A third argument, an exception object, is passed if an exception occured while processing the request.The following is an example showing the usage of this method:Live Demo           Handling errors in jQuery           ... Read More

Use the global error handler to receive a few of the parameters that jQuery can provide. After that add the suppressErrors: true.  You can try to run the following code to disable some jQuery global Ajax event handlers for a request:Live Demo $(document).ready(function(){   $("div.log").ajaxError(function(evt, xhr, settings) {     if(settings.suppressErrors) {         return;     }     $(this).text( "ajaxError handler is triggered" );  });    $("button.trigger").click(function() {     $("div.log").text('');     $.ajax("ajax/missing.html");  });  $("button.triggerSuppress").click(function() {     $("div.log").text('');     $.ajax( "ajax/missing.html", {         suppressErrors: true     });  }); }); Trigger (process errors) Trigger (won't process errors) Check log

Ajax requests produce a number of different events that you can subscribe to. There are two types of events:Local EventsThese are callbacks that you can subscribe to within the Ajax request object.$.ajax({    beforeSend: function(){       // Handle the beforeSend event    },    complete: function(){      // Handle the complete event    }    // ...... });Global EventsThese events are broadcast to all elements in the DOM, triggering any handlers which may be listening. You can listen for these events like so:$("#loading").bind("ajaxSend", function(){    $(this).show();  }).bind("ajaxComplete", function(){    $(this).hide(); });Global events can be disabled, for a ... Read More

ajaxSuccess() methodThe ajaxSuccess( callback ) method attaches a function to be executed whenever an AJAX request completes successfully. This is an Ajax Event.Here is the description of all the parameters used by this method −callback − The function to execute. The event object, XMLHttpRequest, and settings used for that request are passed as arguments to the callback.Assuming we have the following HTML content in result.html file:THIS IS RESULT...ExampleThe following is an example showing the usage of this method:Live Demo           The jQuery Example                         ... Read More

ajaxStop() methodThe ajaxStop( callback ) method attaches a function to be executed whenever all AJAX requests have ended.Here is the description of all the parameters used by this method −callback − The function to execute.Assuming we have following HTML content in result.html file:THIS IS RESULT...ExampleThe following is an example showing the usage of this method:Live Demo           jQuery ajaxStop() method                              $(document).ready(function() {                         /* Global variable */       ... Read More

ajaxSend() methodThe ajaxSend(callback) method attaches a function to be executed whenever an AJAX request is sent.Here is the description of all the parameters used by this method:callback − The function to execute. The XMLHttpRequest and settings used for that request are passed as arguments to the callback.Assuming we have the following HTML content in result.html file:THIS IS RESULT...ExampleThe following is an example showing the usage of this method:Live Demo           The jQuery Example                              $(document).ready(function() {           ... Read More