Develop Reference

javascript focus on div element using # id

hello what I want it is simply like in the image below :
I want if I add #element1 so the div which have the same id ="element1" so it will get colored somehow , I just want to know what to type on google so I can find a solution because I searched for javascript hash etc but without any success.

you need to use window.location.hash to get the hash value
so if your hash is #someId23
do something like:
if (window.location.hash){
$(window.location.hash).addClass('selected');
}

This answer will help you to focus div, then you can use 'div:focus, div:active' pseudo classes and add some animation there, there are a lot, google it
This is better than jQuery manipulation. Also page performance doesn't affected

CSS doesn't work after div id swap with js

Im trying to keep css working after swapping div id with js replace. I can't really figure it out i don't know what's wrong at all. Actually it's so simple that i don't even know what to think ...
<style>#WD4 { color:red; }</style>
<div id="60b0b9b1">qww4t</div>
<script>var x = document.body.innerHTML;x = x.replace('60b0b9b1', 'WD4');</script>
I just want color to apply. Im sure there's even more than one way around I just can't get it.
Big thanks in advance.
I actually forgot a few important things:
There are more than just one divs with 'WD4' ID
I can't edit document i can only inject my javascript code
I can't edit styles either

You can find the element by id:
document.getElementById("60b0b9b1").id = 'WD4';
FIDDLE
And your css is looking for #WD3 not #WD4

looks like you need to adjust your style to #WD4
Personally I would just add a css class to the element and not style the unique ID of the element.

Calculate height of div with dynamically populate ID value

I have a div tag in in my JSP page. Its ID is autopopulated by other parameters that I don't have control over.
The div tag looks like this. I am skipping the contents in the div in this post.
<div class="parallax styleswitch" id="${nodeId}" style="${desktopstyle}" data-large="${desktopstyle}" data-medium="display:none;" data-small="display:none;" data-dtautoheight="true" data-tabautoheight="false" data-mobautoheight="false">
I want to calculate the height of this div. I was able make that work for div with static ID
$(".testt").height();
http://jsfiddle.net/m7cyw70y/
How can I use the nodeId variable value in the JS to get the div's height? My JS code is in in the JSP page wrapped around script tags.

In the JS code, use the auto-populated parameters to your benefit on server-side:
var nodeToGetHeight = "${nodeId}";
$("#" + nodeToGetHeight).height();
These auto-populated parameters could be used to populate an array that could then be looped through for multiple heights.

You can use another attribute instead of the id. An example using the class attribute:
$('div.parallax').height();
You can also use a custom attribute:
<div custom-attr="myCustomAttr"></div>
$("div[custom-attr='myCustomAttr']").height();
There are even more approaches.

How to change CSS of a dynamically generated DIV's id?

I have a DIV containing a loader gif picture :
... some php codes to get the $pdId
... while loop to generate dynamic li's
echo'<li><div class="loadme" id="'.$pdId.'"><img id="qtyloading" src="../../images/loading_6.gif" width="160" height="160"/></div>
.... some other codes
</li>';
..... end of the while loop
There is a textarea tag that will call the external js function onBlur
.... some codes here
echo '<textarea rows="3" cols="30" id="<separator>'.$ud.'<separator>'.$olue.'<separator>'.$pdId.'<separator>" onBlur="yorDesc(this.id,this.value)" >'.$deomer.'</textarea><br />';
and here is the external js file
... some codes to get the id
alert (gid);
document.getElementById("'+gid+'").style.display = "block";
the gid var is the ID of the loadme div, as you see I am alerting it and it showes the correct ID being parsed, and of course you have noticed that the loadme div being generated dynamically with different IDs. I supposed that I would be able to have access to each individual loader DIV by using the above mentioned javascript code, but I am not.
Could you help me to find out why? Ask me if any part of the above code or description is not clear for you I will edit it.
Appreciated.

document.getElementById(gid.toString()).style.display = "block";
This will do the trick. Or you can use (''+gid+'') if you prefer. You almost had it, just mixed too many different quotes together.

If it is id then you can use like.works well.
document.getElementById(gid).style.backgroundColor="red";
In your case need not worry about dynamically created div through PHP.
Fiddle Demo

Javascript question regarding hiding certain divs by id thats a changing random number

Can anyone help me with javascript that hides divs matching a specific random number? Every time I load this page it has two divs like <div id='1945498985'> the number changes every page load but remains between 9-10 in length how would I fetch the two divs on the page and remove/hide them?
Let me clarify the two divs on this page each have a random number between 9 and 10 in length.
One such div looks like this:
<div id='843401712' style='position:relative;z-index: 1000;left: 75px;top: -340px; padding:0px; margin: 0px;width: 310px; height:280px; text-align: center; border:3px gray solid'></div>
I do not have control over the generated html I am looking to run javascript alongside a page as a greasemonkey extension to hide these two divs.
Thanks for any help you guys offer, I'm new to javascript so its a big help.

Use document.getElementsByTagName() to fetch all div elements. Then, check their id using maybe a regular expression like [0-9]{9,10} and if the id matches, remove/hide them.

You have two problems with your question.
First, you're suggesting that you have two divs with the same ID, which is illegal.
Secondly, your ID is all numeric, which is also illegal.
Here (using jquery for brevity and assuming you're getting your random from a dynamically generated page like from PHP) is an example of doing what you're looking for:
<script type="text/javascript">
var pRand = '<?php echo $pRand; ?>';
document.ready(function(){
$('.el-'+pRand).hide();
});
</script>
...
<div class="el-<?php echo $pRand;?>"></div>
<div class="el-<?php echo $pRand;?>"></div>

Use jQuery filter and provide a function that does a regex match on your id:
http://api.jquery.com/filter#expr
See here:
http://jsfiddle.net/ANW8C/
In your case...
Example:
$('div').filter(function() {
return this.id.match('\\d{9,10}');
} ).hide();

I suggest to you using jquery it has some selector filters that may help you to selecting correct div
http://api.jquery.com/category/selectors/

As others have said, you should first make sure you have legal ID values. They cannot start with a number and there can only be one object with a given ID in the page.
If you have any control over the generated HTML, it would be best to put a common class name on all divs that you want to hide. You can then easily find them or add a style rule that will hide them.
<div id='a1945498985' class="hideMe"></div>
<div id='a2945498986' class="hideMe"></div>
The, you can either hide all objects with that class name. In jQuery, that would simply be this:
$(".hideMe").hide();

Here are some examples - I haven't used jQuery because you haven't suggested that you are using it. It is very useful for this kind of stuff, but you can also solve the problem without it if you need to.
http://jsfiddle.net/Sohnee/tpGqj/
There are two methods used, one relies on a parent container and the other uses the new getElementsByClassName support that some browsers have (you can roll your own getElementsByClassName if you need to support older browsers).
Ideally, you wouldn't apply a random id to an element - there seems little point in giving an element a random id. If you are setting the random id server side, you could also supply the id to the JavaScript so it can target the element with a getElementById call, which would be the most efficient.
Also, I concur with the statements about numeric ids being invalid - you should put at least one alphabetical character at the start of the id.