add type to DOM element with JQuery

Question

Im trying to append a type=checkbox to the last td of every tr

Ive been playing around with the idea of traversing in achieving this, but I have no idea if it can work. Something along the lines of this.

$('#myID tr').children("td:nth-last-of-type(1)").addClass("me");

I know this is adding a class to the element, but can it be done in a similar way to add a TYPE to the tr DOM element? There is one or two examples out there like this one, but its all around changing the type and not adding a new one.

<table id="myID" class="myClass">
    <tr>
        <th>one</th>
        <th>two</th>
        <th>three</th>
        <th>four</th>
    </tr>
    <tr>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
    </tr>
    <tr>
        <td>a</td>
        <td>b</td>
        <td>c</td>
        <td type='checkbox'></td>    <!--  **THIS IS WAHT IM AFTER**  -->
    </tr> 
</table>

<input type='button' id='but_id' value='Click Me'/>

it's setting, not changing and It should work... Have you tried it out? (talking about the example in the link) — Hristo Valkanov, Jul 23 '14 at 09:30
I don't think `` elements are meant to have the `type="checkbox"`? — Rob Schmuecker, Jul 23 '14 at 09:32
@RajaprabhuAravindasamy - Simple does it hey. Thanks so much. — morne, Jul 23 '14 at 09:32
`` does not have `type` attribute at all. See: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/td — Umur Kontacı, Jul 23 '14 at 09:33
@RobSchmuecker - I should add a `input` element inside the `tr` hey...? TRUE — morne, Jul 23 '14 at 09:34

score 1 · Answer 1 · answered Jul 23 '14 at 09:34

1

You can append an input element to the td.

$(document).ready(function () {
        $('#myID tr').children("td:nth-last-of-type(1)").append("<input type='checkbox'/>");
    });

Demo : http://plnkr.co/edit/qVIUDfAxp2vUIxw2AQEp?p=preview

answered Jul 23 '14 at 09:34

Pranav

666
3
7

score 1 · Accepted Answer · answered Jul 23 '14 at 09:35

1

You can not add type="checkbox to td, it's useless and invalid but you can add checkbox to td e.g.

$('#myID tr').children("td:nth-last-of-type(1)").append('<input type="checkbox" />');

answered Jul 23 '14 at 09:35

Milan and Friends

5,560
1
20
28

Sudharsan S · Answer 3 · 2014-07-23T09:40:50.383

1

You can't add type = 'checkbox' in td it is invalid. Just append the input type in the td

$('#myID tr').find("td").last().append("<input type='checkbox' />");

evert last td means

 $('#myID tr').find("td:nth-last-child(1)").append("<input type='checkbox' />");

DEMO

edited Jul 23 '14 at 09:40

answered Jul 23 '14 at 09:35

Sudharsan S

15,336
3
31
49

score 0 · Answer 4 · answered Jul 23 '14 at 09:36

0

Adding type = 'checkbox' doesn't mean anything its wrong html. you can add checkbox in td.

$('#myID tr').children("td:last-child").append('<input type="checkbox" />');

DEMO

answered Jul 23 '14 at 09:36

Manwal

23,450
12
63
93

score 0 · Answer 5 · answered Jul 23 '14 at 09:39

0

Did you mean appending a checkbox to the last cell? Try this.

$("#myID tr td:last-child").append("<input type='checkbox' />");

http://jsbin.com/zerocasu/2/edit

answered Jul 23 '14 at 09:39

Garrett

1,658
2
17
29

add type to DOM element with JQuery

5 Answers5

DEMO