Change html dir attribute using jQuery

javascript jquery jquery-ui jquery-events right-to-left

11,492

simple as it can be...

<script>
$(document).ready(function(){
     $("html[lang=ar]").attr("dir", "rtl")
        .find("body").addClass("right-to-left");
});
</script>

and a link that explain about ready() and load() function..

http://4loc.wordpress.com/2009/04/28/documentready-vs-windowload/

11,492

Author by

Brian Tompsett - 汤莱恩

I am a lecturer of Computer Science at the University of Hull. I have worked in the software industry in the US and the UK. I have over 50 years software development experience, in writing compilers, operating system implementation and porting, networking protocol stacks, protocol analysers and software for arcane and unusual architectures. I am experienced at answering and solving students' programming and computer science questions. I teach the networking, compilers and security courses. My research areas include computer crime, forensics and security. I was the first timelord and created the tardis.

Updated on June 04, 2022

Comments

Brian Tompsett - 汤莱恩 almost 2 years
I want to change HTML dir attribute once the page loads; how can I do that? Do I need to use the .ready() function? Currently it looks like:
```
jQuery("html[lang=ar]").attr("dir", "rtl")
            .find("body").addClass("right-to-left");
```
How can I write it in a script; do i need to write in .ready() function or .load()?
```
<div class="header">
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
jQuery("html").attr("dir", "rtl")?
</script>
```
The code appears like this:

This is my CSS
```
body.right-to-left li {
    float:right;
    direction: rtl;
}
```
- Amyth over 11 years
  
  use it under $(document).ready
- Ram over 11 years
  
  It seems you know the answer.
- Felix Kling over 11 years
  
  No, you don't need it. It should work just fine: jsfiddle.net/Q6c93. Make sure the html tag actually has a lang=ar attribute. Of course you'd need .ready or .load to attach the class to the body. But what exactly is your problem? Is the attribute not changed? Is the class not added? Do you get an error? Where is your code located in the document? The more information you provide, the easier it is for us to help you.
- AlexandruSerban over 11 years
  
  every function that is in $(function () {}) is called after the document has loaded.
- Admin over 11 years
  
  @FelixKling my class doesn't loaded.. I can see my code in view source
- Ram over 11 years
  
  @user1765876 View Source only shows the markup before JavaScript is executed, you should use debugging tools like firebug.
- Admin over 11 years
  
  @undefined but I can see that it is ltr and through Inspect element I change it to rtl
Admin over 11 years

It doesn't worked, I saw the viewsource.. but the html has still dir=ltr instead of rtl
bipen over 11 years

can u post your html code where u want to change the attribute??
Admin over 11 years

<?php if($_GET["lang"] == "ar") { ?> <script type="text/javascript"> $(document).ready(function(){ $("html[lang=ar]").attr("dir", "rtl") .find("body").addClass("right-to-left"); }); </script> <?php } ?>
bipen over 11 years

does your html has lang attribute... <html lang="ar">