How to get the width of an element using jQuery?

In this post, we will show how to get the width of an element using jQuery, using the width() method.

1. Code:

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $("button").click(function(){
        alert("Width of element: " + $("#test").width());
    });
});
</script>
</head>
<body>
<div id="test" style="height:200px;width:400px; margin:1px;padding:20px; background-color:red;"></div><br>
<button>Get Width</button>

</body>
</html>

2. Example:

Run the program to get the result.

CSS JavaScript