1
<div> Hii,this is just an example  </div>

change to

<td>Hii, only tag will be change  </td> 
Asons
  • 84,923
  • 12
  • 110
  • 165
Rivon
  • 37
  • 1
  • 2
  • 1
    Well, not really, a `` has ``'s, and `
    `'s have everything else! Are you asking this question http://stackoverflow.com/questions/918792/use-jquery-to-change-an-html-tag?
    `'s and `
    – Eugene Oct 12 '16 at 20:54
  • Need to be a lot more specific. A `
    ` can't exist in same location as a `` and vice versa . Read through [ask] then update question with proper details and html sample
    – charlietfl Oct 12 '16 at 20:57
  • The basic what i wanted to say is , the code written in
    structure can be changed into ,,,
    etc or (Inky grids). Once i found how to transforme the tags (
    to HTML tags), thr rest thing will done by Inky which will convert comples table structure into simple HTML tags.
    – Rivon Oct 13 '16 at 04:58

3 Answers3

3

html div structure to table

html

    <div class='tr'>
        <div class='td'>this will be 1st TD</div>
        <div class='td'>this will be 2nd TD</div>
        <div class='td'>this will be 3rd TD</div>
    </div>
    <div class='tr'>
        <div class='td'>this will be 1st TD</div>
        <div class='td'>this will be 2nd TD</div>
        <div class='td'>this will be 3rd TD</div>
    </div>
    <div class='tr'>
        <div class='td'>this will be 1st TD</div>
        <div class='td'>this will be 2nd TD</div>
        <div class='td'>this will be 3rd TD</div>
    </div>

script

<script>
var div2table = $('.tr').map(function () {
                var issue = $(this);
                var tdline = issue.find('.td').map(function () {
                    return '<td>' + $(this).text();
                }).get().join('</td>');
                return '<tr>'  + tdline + '</td>';
            }).get().join('</tr>');

div2table = '<table>' + div2table + '</tr></table>';

console.log(div2table);
</script>

use div2table variable to print your result

Output

<table>
    <tbody>
        <tr>
            <td>this will be 1st TD</td>
            <td>this will be 2nd TD</td>
            <td>this will be 3rd TD</td>
        </tr>
        <tr>
            <td>this will be 1st TD</td>
            <td>this will be 2nd TD</td>
            <td>this will be 3rd TD</td>
        </tr>
        <tr>
            <td>this will be 1st TD</td>
            <td>this will be 2nd TD</td>
            <td>this will be 3rd TD</td>
        </tr>
    </tbody>
</table>
Ishtiaq Ahmed
  • 126
  • 1
  • 11
1

in case someone needs to convert on the-fly:

var div2table = $('.outer-div ').map(function () {
                var issue = $(this);
                var trline = issue.find('.inner-div').map(function () {
                    return '<td>' + $(this).text();
                }).get().join('</td>');
                return '<tr>'  + trline;
            }).get().join('</tr>');

div2table = '<table>' + div2table + '</table>';

where divs are

<div class='outer-div'><div class='inner-div'>this will be 1st TD</div>.....</div>
yob
  • 528
  • 4
  • 9
0

You don't need to use jQuery to convert a block level element to table-cell:

div{
    display:table-cell;
}
<div> Hii,this is just an example  </div>
<div> Hii,this is just an example  </div>
<div> Hii,this is just an example  </div>
<div> Hii,this is just an example  </div>
<div> Hii,this is just an example  </div>
Roko C. Buljan
  • 196,159
  • 39
  • 305
  • 313
  • Thanks for your reply @Roko – Rivon Oct 13 '16 at 04:59
  • The basic what i wanted to say is , the code written in
    structure can be changed into ,,,
    etc or (Inky grids). Once i found how to transforme the tags (
    to HTML tags), the rest thing will done by Inky which will convert comples table structure into simple HTML tags.
    – Rivon Oct 13 '16 at 05:00