How to loop foreach in blade while using jquery in Laravel - html

Question

I'm using Laravel 5.4 and I have never tried jquery so I have no idea what I'm doing, unfortunately.
This is my blade:
<h3>Comments:</h3>
<ul class="list-unstyled activity-list">
#foreach ($threads->comments()->where('parent', 0)->orderBy('created_at', 'desc')->get() as $comment)
<li>
<img src="{{ $comment->user->getAvatar() }}" alt="Avatar" class="img-circle pull-left avatar">
<p><a href="{{ route('profile.view', $comment->user->id) }}">
{{ $comment->user->user_name }}</a>:
<br>
{{ $comment->content }}
<span class="timestamp">{{ $comment->created_at->diffForHumans() }}</span>
</p>
#if ($threads->lock == 0)
<a id="btn-comment" style="padding-left:3.5em">reply</a>
<br>
<form action="{{ route('threads.comments.add') }}" id="comment" method="POST" style="padding-left:3.5em; display:none;">
{{ csrf_field() }}
<input type="hidden" name="thread_id" value="{{ $threads->id }}">
<input type="hidden" name="parent" value="{{ $comment->id }}">
<input type="text" name="content" class="form-control" placeholder="Add reply...">
<input type="submit" class="btn btn-primary btn-xs" value="Add Reply">
</form>
<br>
#endif
#foreach ($comment->childs as $child)
<div style="padding-left:3.5em;">
<img src="{{ $child->user->getAvatar() }}" alt="Avatar" class="img-circle pull-left avatar">
<p><a href="{{ route('profile.view', $child->user->id) }}">
<span style="padding-left:1em;">{{ $child->user->user_name }}</a>: </span>
<br>
<span style="padding-left:1em;">{{ $child->content }}</span>
<span class="timestamp" style="padding-left:4.3em;">{{ $child->created_at->diffForHumans() }}</span>
</p>
</div>
#endforeach
</li>
#endforeach
</ul>
Here's my custom script:
<script>
$(document).ready(function(){
$('#btn-comment').click(function(){
$('#comment').toggle('slide');
});
});
</script>
These lines specifically are the ones that I'm trying to run using the script above:
#if ($threads->lock == 0)
<a id="btn-comment" style="padding-left:3.5em">reply</a>
<br>
<form action="{{ route('threads.comments.add') }}" id="comment" method="POST" style="padding-left:3.5em; display:none;">
{{ csrf_field() }}
<input type="hidden" name="thread_id" value="{{ $threads->id }}">
<input type="hidden" name="parent" value="{{ $comment->id }}">
<input type="text" name="content" class="form-control" placeholder="Add reply...">
<input type="submit" class="btn btn-primary btn-xs" value="Add Reply">
</form>
<br>
#endif
Ask me if you need further detail