Center align text in HTML Element(s) using jQuery
Selected some HTML elements in the document, centre align the text in the elements using jQuery.
Solution
To centre align text in selected HTML elements using jQuery, call css() function on the selected elements and pass the arguments: "text-align"
CSS property, and "center"
value for the CSS property.
For example, the syntax to centre align all paragraphs in the document is
$("p").css("text-align", "center");
Programs
1. Center align text in paragraphs in the document.
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
<script>
function myAction() {
$("p").css("text-align", "center");
}
</script>
</head>
<body>
<button onclick="myAction()">Center align text in paragraphs</button>
<p style="background:yellow;">This is paragraph.</p>
</body>
</html>