Javascript inputa değer atama hakkında

Merhaba arkadaşlar,

<div class="form-group">
                        <label for="OutSum">@lang('app.sum')</label>
                        
                        <input type="text" class="form-control" id="OutSum" name="summ" placeholder="@lang('app.sum')" required>
                        <input type="hidden" name="type" value="add">
                        <input type="hidden" id="AddId" name="user_id" value="@if(isset($user)){{ $user->id }}@endif">
                        <input type="hidden" name="_token" value="{{ csrf_token() }}">
                    </div>

böyle bir modalla açılan ve kredi eklenen bir menüm var ve bu şekilde

<div class="form-group">
                        <label for="OutSum">@lang('app.sum')</label>
                        
                        <input type="text" class="form-control" id="OutSum" name="summ" placeholder="@lang('app.sum')" required>
                    <br>    
                           <div class="col-sm-12 text-center inamountDiv">
                                <button type="text" class="btn btn-primary " id="10" >
                                    10.00 </button>
                                <button type="text" class="btn btn-primary btnIN" id="20">
                                    20.00</button>
                                <button type="text" class="btn btn-primary btnIN" id="30">
                                    30.00</button><br><br>
                                    <button type="text" class="btn btn-primary " id="50" >
                                    50.00 </button>
                                <button type="text" class="btn btn-primary btnIN" id="100">
                                    100.00</button>
                                <button type="text" class="btn btn-primary btnIN" id="200">
                                    200.00</button>
                                 <div class="mb-2"></div>
           </div>     
                        <input type="hidden" name="type" value="add">
                        <input type="hidden" id="AddId" name="user_id" value="@if(isset($user)){{ $user->id }}@endif">
                        <input type="hidden" name="_token" value="{{ csrf_token() }}">
                    </div>

değerler atanan butonlara tıklandığında input alanına tıklanan butondaki değeri yazdırmak istiyorum.
aşağıdaki kodu denedim ama malesef olmadı.

 <div class="form-group">
                        <label for="OutSum">@lang('app.sum')</label>
                        
                        <input type="text" class="form-control" id="OutSum" name="summ" placeholder="@lang('app.sum')" required>
                       
<div class="col-sm-12 text-center inamountDiv">
                                <button type="text" class="btn btn-primary " id="10" >
                                    10.00 </button>
                                <button type="text" class="btn btn-primary btnIN" id="20">
                                    20.00</button>
                                <button type="text" class="btn btn-primary btnIN" id="30">
                                    30.00</button><br><br>
                                    <button type="text" class="btn btn-primary " id="50" >
                                    50.00 </button>
                                <button type="text" class="btn btn-primary btnIN" id="100">
                                    100.00</button>
                                <button type="text" class="btn btn-primary btnIN" id="200">
                                    200.00</button>
                        <input type="hidden" name="type" value="add">
                        <input type="hidden" id="AddId" name="user_id" value="@if(isset($user)){{ $user->id }}@endif">
                        <input type="hidden" name="_token" value="{{ csrf_token() }}">
                    </div>
                    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
                       <script>
            $(document).ready(function(){
                              $("#OutSum").click(function(){
                                               $("#10").text("10");
                                               });
                              $("#OutSum ").click(function(){
                                               $("#20").html("20");
                                               });
                              $("#OutSum ").click(function(){
                                               $("#30").val("30");
                                               });
                              
                               $("#OutSum ").click(function(){
                                               $("#50").val("50");
                                               });
                                
                              $("#OutSum ").click(function(){
                                               $("#100").val("100");
                                               });
                              
                              $("#OutSum ").click(function(){
                                               $("#200").val("200");
                                               });
                              });
            </script>

nerede yanlış yada eksik yaptığımı biri söyleyebilir mi ?

click eventini inputa vermişsiniz hocam, butona vermeniz gerekmekte. Aşağıdaki şekilde çalışması gerekir.

<div class="form-group">
        <label for="OutSum">@lang('app.sum')</label>
        <input type="text" class="form-control" id="OutSum" name="summ" placeholder="@lang('app.sum')" required>
        <div class="col-sm-12 text-center inamountDiv">
            <button type="text" class="btn btn-primary price-btn" id="10" data-price="10">
                10.00
            </button>
            <button type="text" class="btn btn-primary btnIN price-btn" id="20" data-price="20">
                20.00
            </button>
            <button type="text" class="btn btn-primary btnIN price-btn" id="30" data-price="30">
                30.00
            </button><br><br>
            <button type="text" class="btn btn-primary  price-btn" id="50" data-price="50">
                50.00
            </button>
            <button type="text" class="btn btn-primary btnIN price-btn" id="100" data-price="100">
                100.00
            </button>
            <button type="text" class="btn btn-primary btnIN price-btn" id="200" data-price="200">
                200.00
            </button>
            <input type="hidden" name="type" value="add">
            <input type="hidden" id="AddId" name="user_id" value="@if(isset($user)){{ $user->id }}@endif">
            <input type="hidden" name="_token" value="{{ csrf_token() }}">
        </div>
    </div>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script>
        $(document).ready(function () {
            $(".price-btn").on("click", function () {
                let price = $(this).data("price");
                $("#OutSum").val(price)
            })
        });
    </script>

çok çok teşekkürler hocam ekleme ve silme işlemi başarili bir şekilde gerçekleşiyor.