Develop Reference

jQuery remove div by ID on load

I'm trying to remove an entire div on page load. Currently I'm trying to use:
$(document).ready(function(){
$("#removeme").remove();
});
with the HTML
<div id="removeme">If JS enabled remove this!</div>
I've been searching for hours, using many variations including getElementById. No luck.
Javascript/jQuery aren't languages I use often.
All help is appreciated. Thanks!
Edit: Fixed, page I was adding it to was having some issues (another dev built it). I put the code into an existing JS file instead and it works. Thank you all.

$('#remove').html('');
or
$('#remove').empty();
That will remove that text if JS is enabled.

The code you are showing in your question works, as proven by #barmar :
"http://jsfiddle.net/barmar/epsZe/"
If it doesn't work for you, it is most likely because you have an error in your Javascript before you reach the code displayed here. Also, ensure that you have included Jquery before-hand.
To find where previous errors could have happened, you can look inside your Javascript console. Here is a question where it is described where to find your console on most browsers :
What is console.log and how do I use it?
If you don't want to use the console, you can put alerts in your Javascript code until you find where they stop displaying.

try this
$("#removeme").replaceWith("");

Blocking the UI using HTML and CSS

I'm writing a userscript. What I'm trying to do is really simple. I need to block the UI while the script does some background tasks. I saw this method in another SO question and I changed it a bit to suit me.
Check this fiddle. When you click on the button, it covers up the UI.
Now since this is gonna be used on a webpage, I need to inject the following HTML part to the webpage through the script.
<div id="blocker">
<div>Loading...<img src="http://www.socialups.com/static/images/fbinventory/ajax_loader.gif"></div>
</div>
I did it like this.
var blockUI = document.createElement("div");
blockUI.setAttribute("id", "blocker");
blockUI.innerHTML = '<div>Loading...<img src="http://www.socialups.com/static/images/fbinventory/ajax_loader.gif"></div>'
document.head.appendChild(blockUI);
Check this fiddle for a clear idea.
But it does not work. I tried several ways to tackle the problem but to no avail .Can anyone please point out what I'm doing wrong here?
Thank you.
P.S - I need to do this without using jQuery or the library blockUI.

You are trying to append stuff to head; append it to body instead.
http://jsfiddle.net/dAKQX/

Don't put the block div in the head section of your document. Use document.body.appendChild(blockUI); instead.

you need to append your div to the body of the document. See: http://jsfiddle.net/zkzQy/1/
or like this in your code:
document.body.appendChild(blockUI);

Smallest WYSIWG editor you can find?

I am searching for the smallest WYSIWG editor i can find.
I have tried TinyMCE, CKEditor etc. but i can not find a small one, all has hundreds of kb js files to load.
I dont need image upload etc, even if i like the one Stackoverflow using so think i need some that more shows like Word but really basic features.
I am using jQuery in the project and i it is a ASP.NET MVC 3.0 project but i really like jQuery and normal html instead of ASP.NET components.
But i am open for ideas about everything that are really basic and tiny size.
Someone has any idea?

Here you go:
<p contenteditable="true">Editable text!</p>
Admittedly it's not the most fully-featured editor out there, but it's certainly basic and tiny.

The smallest one I've found is CLEditor: http://premiumsoftware.net/cleditor/

Have you tried http://www.aloha-editor.org/index.php ?

try this
http://www.wyzz.info/downloads_page.html

Check out TinyMCE. http://tinymce.moxiecode.com/

jQuery FancyBox/Lightbox problem

i write some html with JS into a div.
like this
$("#picdiv").html("<a rel='lightbox' href='pic.jpg'><img src='htumb.jpg'></a>");
it is just an example.
So, i have in $(document).ready Funcktion this code.
$('a[rel=lightbox]').fancybox();
but if i click on the link, a get to the page with picture... i know the Problem must be, i write the html with js, but i have no other option. So haw can I make fancybox works?

This is due to how jQuery works. The fancybox function will only work for current elements on the page and not ones dynamically added by javascript.
A quick fix might be to be modify the code as follows:
$("#picdiv").append($("<a rel='lightbox' href='pic.jpg'><img src='htumb.jpg'></a>").fancybox());
Not sure if the above will work, but the general idea is to ensure that any new elements created have the plugin applied.

solution
$('.picture_display').find('a[rel=lightbox]').fancybox();

Search and replace

I'm working on a new project and i want to do something similar (somehow) to intellitext ads (without popup though). In fact, i want to add links on certain words. The problem is that i don't know how to handle this.
I mean, ok, i get document.innerHTML then what? I can find any word, but some may be inside of tags. I don't want to replace words from textarea or text inside of a link. Same for input, select, and so on.
Also, the way i've managed things, i replace even the html tags (if the word is select for example, the script will replace <select> tag. And i really don't want this :P
So, any idea? Where to start ? What to do? Anything?
I wish a solution that works without any library, or, if is mandatory, to work with jquery (this is what i know).
I think that some regexp may help. The problem is... I never understand them :s
Any help will be appreciated. Thanks a lot!

jQuery does this already!
Just use .text() to get all the text underneath. Documentation and examples are here.