How do I make a table row highlight if the checkbox is checked and make the row editable(on button click)?

See more:

HTML

jQuery

HTML5

jQuery-UI

I am creating a Jquery Mobile page which includes a table. The table will display users. Table rows include checkboxes in the first cell, followed by the users information.

I would like the row to be highlighted if the rows checkbox is ticked/clicked. At the bottom of the table there is a button (Edit). This button should only be enabled when at least one row is highlighted. When this button is clicked I want all the highlighted rows content to become editable in place, i.e a textbox will appear in place of the username, with the existing username in the box.

I want to make editable rows on the click of the edit button, when

a) the rows checkbox is ticked/row is highlighted.

The table has been created using a JavaScript loop (function is loaded on page load).

var UsersHTML = "<table class='full_width_table info_table_style ui-body-d ui-shadow table-stripe ui-responsive'>" +
                        "<thead>" +
                           "<tr class='ui-bar-b schedule_row'>" +
                             "<th></th>" +
                             "<th>UserID</th>" +
                             "<th>First Name</th>" +
                             "<th>Surname</th>" +
                             "<th>Home Location</th>" +
                           "</tr>" +
                         "</thead>" +
                         "<tbody>";



for (s = 0; s < 15; s++) {
    //contenteditable='true'
    UsersHTML += "<tr class='schedule_row'>" +
         "<td class='user_check_cell'>" +"<input type='checkbox'>" + "</td>" +
         "<td> " + + "</td>" +
          "<td>" + + "</td>" +
          "<td>" + + "</td>" +
          "<td>" + + "</td>" +
        "<td>" + + "</td>" +
         "<td align='right'";


    UsersHTML += "</td></tr>";
}

UsersHTML += "</tbody></table>";

$("#usersContent").html(UsersHTML);

I have used a div to display the table on the page:

<div id="usersContent">
        </div>

Any help would be great!