Clash Royale CLAN TAG

How can I select ID and get a value of it in input data in this row?

here is what I want to do.

When I click the modify button, I wish div that contains role of 'ucomment' changes into in-line input form with its original value typed.

But I can't even start with selecting the div.

I thought the code here would work and could select what I aimed, but it didn't.

$(this).closest("div[role='ucomment']")


How can I select the div here?

<ul id="comments" class="list-group">
<script id="commentTemplate" type="text/x-handlebars-template">
{{#each list}}
<li class="list-group-item d-flex justify-content-between align-items-center">
<div class="row w-100">
<div class="col-2" name="uid">{{uid}}</div>
<div class="col-8" role="ucomment" name="ucomment">{{ucomment}}</div>
<div class="col-2" name="regdate">{{prettifyDate regdate}}</div>
</div>
<button type="button" class="btn" onclick="modifyComment()">Modify</button>
<button type="button" class="btn" onclick="deleteComment()">Delete</button>
<span class="badge badge-primary badge-pill">14</span>
</li>
{{/each }}
</script>
</ul>
<button id="sendForm" type="submit" class="btn btn-info" onclick="addComment()">Send</button>
<button id="cancel" type="button" class="btn btn-warning" data-toggle="collapse" data-target="#openNew">Cancel</button>
</div>


closest()

By clicking "Post Your Answer", you acknowledge that you have read our updated terms of service, privacy policy and cookie policy, and that your continued use of the website is subject to these policies.