Cannot get correct syntax for index value in javascript function

Question

I have the following php table and js function I've been working on. The problem is, the index ($ind) works correctly in the php, but I cannot figure out the syntax in the js function. The output of var ind= $('id')[ind]; is undefined. When I substitute and set var ind= ; it gives me the last index value in the array for each item. What can I set var ind equal to to capture the $ind value of the php in javascript?

    <table id="manage-items" cellpadding="0" cellspacing="0" border="0">
      <thead>
        <tr class="search">
          <th>&nbsp;</th>
          <th><?php echo $this->translate('Quantity');?></th>
          <th><?php echo $this->translate('Status'); ?></th>
        </tr>
      </thead>

      <?php $ind = 0; ?>
      <?php foreach ($this->items as $item) {
    $item_link = 'type=product';
    ?>

      <div id="item_<?php echo $ind; ?>" style="display:none;">

        <tr id="<?php echo $item['id']; ?>">
          <td>&nbsp;</td>

          <td class="Quantity">
            <?php if ($item->item_quantity) { ?>
            <span class="silvertext"><?php echo $item->item_quantity; ?></span>
            <?php } else { ?>
            <span class="silvertext">0</span>
            <?php } ?>
          </td>

          <td class="Status">

            <?php if (in_array($item['active'], array(0, 1))) { ?>
            <div class="switch">

              <label for="active[<?php echo $ind; ?>]"
                     class="switch-label switch-label-off">Active</label>
              <input type="radio" class="switch-input"
                     id="active[<?php echo $ind; ?>]"
                     name="item[<?php echo $ind; ?>][status]"
                     value="1" <?php if ($item['active'] == 1) echo 'checked'; ?>>

              <label for="inactive[<?php echo $ind; ?>]"
                     class="switch-label switch-label-on">Inactive</label>
              <input type="radio" class="switch-input"
                     id="inactive[<?php echo $ind; ?>]"
                     name="item[<?php echo $ind; ?>][status]"
                     value="0" <?php if ($item['active'] == 0) echo 'checked'; ?>>

              <span class="switch-selection"></span>
            </div>
            <?php } else { ?>
            <?php echo $item['active']; ?>
            <?php } ?>
          </td>
        </tr>
        <?php $ind++; ?>
        <?php } ?>
        </tbody>
    </table>

    <script type="text/javascript">
      $(document).ready(function () {

        if (typeof ind == "undefined") {
          ind = 0;
        }
        $('input[type="radio"]').live('change', function () {
          var status = this.value;
          var id = $(this).parents('tr').attr('id');
          var quantity = $(this).closest("tr").find(".Quantity > span").text();
          var ind= $('id')[ind];

          // a bunch of other javascript

        });
      });
    </script>

Answer 1

var id contains the ID of the tr you want to access.

if you iterate through id with .find, you can access the span that you want to change.

var target = $("#"+id).find('span')[5];

Apply changes then on target

$(target).css("...", "...");