table template html
<body> <table> <tr> <th>İsim</th> <th>Soyisim</th> <th>E-posta</th> <th>Durum</th> </tr> <tr> <td>Devrim</td> <td>Demir</td> <td>devrim1demir@gmail.com</td> <td> <button class="butonlar">KAPALI</button> </td> </tr> <tr> <td>Enes</td> <td>Pehlivan</td> <td>enesphlvn@gmail.com</td> <td> <button class="butonlar">KAPALI</button> </td> </tr> <tr> <td>Osman</td> <td>Gültekin</td> <td>osmangul@gmail.com</td> <td> <button class="butonlar">KAPALI</button> </td> </tr> <tr> <td>Mansur</td> <td>Lavaş</td> <td>mansurlavas@gmail.com</td> <td> <button class="butonlar">KAPALI</button> </td> </tr> </table> <script src="jquery-3.5.1.min.js"></script> <script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script> </body> //css *{ font-family:sans-serif; background:#f3f2ef; } table{ margin:200px auto; text-align:center; background:#fff; border:4px solid dodgerblue; padding:2px; } th, td{ border:2px solid dodgerblue; background:#fff; cursor:default; padding:3px; } .butonlar{ cursor:pointer; background:red; color:white; text-align:center; outline:none; border:none; padding:10px 20px; font-weight:bolder; border-radius:4px; } ////script $(".butonlar").click(function(){ $(this).html("AKTİF"); $(this).css({ "background-color":"green" }); })
