Change div to span

JavaScript
1

Change div to span

Hi all

Is it possible to change just the start and closing tag without effecting the content.

Can I change


 <div><img src="image.jpg" alt="image desc." title="image title" /></div>

to this


 <span><img src="image.jpg" alt="image desc." title="image title" /></span>

The content of the div might be longer so I just want to change the start and elements.

2

You can nest it something like
<div><span><img …> What ever </span></div>

But I think your question is kind of vague, Could you explain more What are you try to accomplish?

3

No, it’s not possible to change an element in to another one, but what can be done is to move the contents of an element to another one, then remove the original element.

4

I did what I wanted to do with


$(div).replaceWith($('<span/>').html($(this).html()));
5

I am trying this

  
<html>
<head>
<script src="http://code.jquery.com/jquery-1.7.1.js"></script>
</head>
<body>
<div><img src="image.jpg" alt="image desc." title="image title" ></div>

<script type="text/javascript">

alert(document.body.innerHTML);  // <div><img ....

// http://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_html_replacewith_func

$('div').replaceWith(function() {

return '<span>'+$(this).html()+'</span>';

//return $(this).html();
});

alert(document.body.innerHTML);  // <span><img ...

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

This code is working in Firefox 4.0b9

unwrap, wrap

  
<html>
<head>
<script src="http://code.jquery.com/jquery-1.7.1.js"></script>
</head>
<body>
<div><img src="image.jpg" alt="image desc." title="image title" ></div>

<script type="text/javascript">
// http://www.w3schools.com/jquery/jquery_ref_html.asp

alert(document.body.innerHTML);  // <div><img ....

// http://www.w3schools.com/jquery/tryit.asp?filename=tryjquery_html_unwrap

$('img').unwrap();

alert(document.body.innerHTML);  //  <img ....

// http://www.w3schools.com/jquery/html_wrap.asp

$('img').wrap('<span></span>'); 


alert(document.body.innerHTML);  // <span><img ...

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