Show Output
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>jQuery Get the Value of a CSS Property</title> <style> div{ width: 100px; height: 100px; margin: 10px; cursor: pointer; display: inline-block; } </style> <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script> <script> $(document).ready(function(){ $("div").click(function(){ var color = $(this).css("background-color"); $("#result").html(color); }); }); </script> </head> <body> <div style="background-color:orange;"></div> <div style="background-color:#ee82ee;"></div> <div style="background-color:rgb(139,205,50);"></div> <div style="background-color:#f00;"></div> <p>The computed background-color property value of this DIV element is: <b id="result"></b></p> </body> </html>