How to append <li> tag at the top inside <ul> with help of jquery in laravel?

Question

I am developing notification dropdown for my website. for that i am trying to append <li> tag at the top of drop down. but currently it is appending at bottom of <ul> .

i tried to add new ul tag but i think that is not good practice.

html

<ul class="dropdown notifications no-hover closed notilist">
 @foreach(Auth::user()->notifications->take(4) as $notification)
    @if(!empty($notification['data']['sender_name']))
<li class='dropdown-item'><b>{{$notification['data']['sender_name']}}</b> Bid on your Auction <b>{{$notification['data']['product_title']}}</b> of <b>{{$notification['data']['bid']}}$</b>
</li>
   @endif
  @endforeach
</ul>

jquery

Echo.private('App.User.'+userId)
 .notification((notification) => {
$('.notilist').append("<li class='dropdown-item'><b> "+notification.sender_name+"</b> Bid on your Auction  <b>"+notification.product_title+"</b>  of <b>"+notification.bid+"</b>$</li>")

 });

I want to append that new <li> tag at the top.

Answer 1

I guess you can look at the jQuery method prepend . Here's the link Prepend

$('.notilist').prepend("<li class='dropdown-item'>text should be here</li>");