replace - jquery change tag




html name (5)

I have this code that doesn't work, can you help me? I want that I changed tag name "p" of class="s7" to "h1"

<script type="text/javascript" src="jquery.js"></script>
    <script type="text/javascript">
        $(document).ready(function(){
           $(".s7").replaceWith($('<h1>' + $(this).html() + '</h1>');
        });
    </script>

Answers

The value of this in your "replaceWith()" call is not going to be the "s7" element; it's going to be whatever this is in the greater "document.ready" handler.

To do what you want, use ".each()":

  $('.s7').each(function() {
    $(this).replaceWith($('<h1>' + $(this).html() + '</h1>'));
  });

With that version, jQuery will call the "each" function for each element with class "s7". Inside that function call, furthermore, jQuery arranges for this to refer to one of those DOM elements on each iteration.

To further elaborate the difference, consider that in both my version and yours the argument to "replaceWith()" is computed before ".replaceWith()" is called. That is, the string concatenation expression involving $(this) is evaluated before the function call. Thus, there's just no way for this to take on the value of any element in the chain; JavaScript simply does not work that way.

With the ".each()" loop, however, we can ensure that this has a useful value. Note that ".each()" also passes a reference to the current DOM element as an explicit parameter, so the code could also look like:

  $('.s').each(function(index, element) {
    $(element).replaceWith($('<h1>' + $(element).html() + '</h1>'));
  });

jQuery html5 tag change to div

You can use replaceWith method:

$('#tt').replaceWith(function(){
   return '<div id="' + this.id + '"></div>'
})

The problem is that you're matching all the elements with class s7, but you need to process them one by one in order to copy their content into new elements. In your current code, this is always document, not the current element.

You can use each() to iterate over the matched elements:

$(".s7").each(function() {
    var $this = $(this);
    $this.replaceWith($("<h1>" + $this.html() + "</h1>"));
});

Or maybe:

$(".s7").each(function() {
    $("<h1>" + $(this).html() + "</h1>").replaceAll(this);
});

You can use replaceWith()

var $foot=$('#tt'), html=$foot.html();

$foot.replaceWith( $('<div id="tt">').append(html) )

To check a checkbox using jQuery 1.6 or higher just do this:

checkbox.prop('checked', true);

To uncheck, use:

checkbox.prop('checked', false);

Here' s what I like to use to toggle a checkbox using jQuery:

checkbox.prop('checked', !checkbox.prop('checked'));

If you're using jQuery 1.5 or lower:

checkbox.attr('checked', true);

To uncheck, use:

checkbox.attr('checked', false);