JavaScript Code

jQuery – Left align text in element(s)

Left align text in HTML Element(s) using jQuery

Selected some HTML elements in the document, align the text in the elements to left side using jQuery.

Solution

To left align text in selected HTML elements using jQuery, call css() function on the selected elements and pass the arguments: "text-align" CSS property, and "left" value for the CSS property.

For example, the syntax to left align text in all paragraphs in the document is

$("p").css("text-align", "left");

Programs

1. Left align text in paragraphs in the document.

<!DOCTYPE html>
<html>
  <head>
    <style>
      p {
        text-align: center;
      }
    </style>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
    <script>
      function myAction() {
        $("p").css("text-align", "left");
      }
    </script>
  </head>
  <body>
    <button onclick="myAction()">Left align text in paragraphs</button>
    <p style="background:yellow;">This is paragraph.</p>
  </body>
</html>

Related Programs

copyright @2022