Develop Reference

Unable to select <a> based on its text and then add an attribute named "target" to it using jQuery

I have the following link inside my web page:
Attachments and Documents
Now I want to select this link based on its text "Attachments and Documents", and set a target attribute for it.
So I tried the following:
var tgb = $('a:contains("Attachments and Documents")')[0];
tgb.attr('target', '_blank');
But I got the following exception :
TypeError: tgb.attr is not a function

As soon as you use index ([0]), tab is no more a jQuery object. To get the jQuery function attr() you have to wrap tgb with $:
var tgb = $('a:contains("Attachments and Documents")')[0];
$(tgb).attr('target', '_blank');
// to demonstrate result
console.log(tgb)
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Attachments and Documents

attr() is a jQuery function. You need to target your variable using jQuery methods
$(tgb)
Hope this helps :)
var tgb = $('a:contains("Attachments and Documents")')[0];
$(tgb).attr('target', '_blank');
console.log(tgb);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Attachments and Documents

var tgb = $('a:contains("Attachments and Documents")');
tgb.attr('target', '_blank');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
Attachments and Documents
The issue with your logic was the [0] that you were putting on the tgb. [0] on a jQuery object breaks the element out of the jQuery object and returns the native Element. There are various reasons why you would want to do this, such as if you wanted to access element properties and you don't want to go through the jQuery prop() or attr() method.
However in your case, you are trying to use the attr() method off of tgb. However, attr() is a jQuery method. Since you broke the element out of the jQuery object, this will not work.
Rather than turning the tgb back into a jQuery object, simply take off the [0]. This fixes your issue, and removes the need to create another jQuery object which, give the snippet you provided, is unnecessary work.
Optionally, if you do want it to be a native Element you could just set the attribute directly.
var tgb = $(...)[0];
tgb.setAttribute('href', newValue);
//or
tgb.href = newValue;

Put an id to a parent element

I wanted to put an id in my element's parent element. Below is my code:
<div>
<div id="child"></div>
<div>
Im aware that jquery has a way to select a parent element , but I dont know how what method shall I use to put an id to it. Below is my jquery code:
div_resizable = $( "#child" ).parent();
div_resizable.id = "div_resizable";
Above code doesnt work with me. It doesnt throw an error, but no changes had taken effect. Any solution to my problem?

For achieve what you want, you can use the jquery attr:
$("#child" ).parent().attr('id', 'newID');
Or you can use the prop:
$("#child" ).parent().prop('id', 'newID');
And you can check the difference between the two here: difference between prop() and attr()

Of course div_resizable.id = "div_resizable" doesn't work. div_resizeable is an jQuery array and you are trying to assign id to it.
Try .attr instead:
$("#child").parent().attr({id: "div_resizable"});

To set a property on the first element inside a jQuery result object:
div_resizable = $( "#child" ).parent()[0];
// ^^^
div_resizable.id = "div_resizable";
This picks the first Element from the result so that you can directly access the property.
Or:
$('#child').parent().prop('id', 'div_resizable');
Use the .prop() helper method to accomplish the same thing.

Is there a way to modify a specific attribute of every jquery object in one call?

Basically.... I am using this code
var editorLinks;
editorLinks = $(".admin_editor_link.html");
$.each(editorLinks, function(i, link){
$(link).html($(link).attr("data-loadedtext"));
});
And I am wondering if there is some way to do it without the $.each call... like...
editorLinks.html($(this).attr("data-loadedtext"));
I assumed this would work (or some variation of it that I cant remember) but when I tried it all elements html was set to the data-loadedtext of the first element in the array.

Use a function supplied to html():
editorLinks.html(function(){
return $(this).attr("data-loadedtext");
});
The return value of the function is used as the value for html() for each element.
Using your example HTML in comment:
JSFiddle: http://jsfiddle.net/TrueBlueAussie/taesc0tt/2/

Yes, you can, but you'll need to change the name of your class to admin_editor_link because jQuery selector is trying to find elements with both admin_editor_link and html classes. (Unless, of course, you actually looking for elements with both those classes - your question has no HTML code to verify that - in which case you're fine).
<div data-loadedtext="1" class="admin_editor_link"></div>
<div data-loadedtext="2" class="admin_editor_link"></div>
Just use a function to return the result
var editorLinks = $(".admin_editor_link");
editorLinks.html(function () {
return $(this).attr("data-loadedtext");
});
DEMO
DEMO with both classes

Use a jQuery Selector as a Variable

I am creating a variable that stores an elements ID in the variable. I could write it like this:
var webappData = document.getElementById('web-app-data');
If I wanted to do the same using jQuery I think I would write it like this:
var webappData = $('#web-app-data');
However, when I try that it doesn't work. (Script throws an error because the variable isn't selecting the div with that Id.)
How would I use jQuery to select an element and store it in a variable?

document.getElementById('web-app-data') isn't the same as $('#web-app-data'). The later returns jQuery object, which is kind of an array of HTMLElement objects (only one in your case).
If you want to get HTMLElement, use $('#web-app-data')[0]. Check:
document.getElementById('web-app-data') === $('#web-app-data')[0]; // true

It's ok.. Maybe something else is wrong in your code..
Example:
<div id="web-app-data">
Hello
</div>
<script type='text/javascript'>
var webappData = $('#web-app-data');
alert(webappData.text()); // Hello
</script>
Fiddle

Above code should work just fine. Your problem might be, that jQuery doesn't find any corresponding elements from the DOM since the element has been removed or hasn't been loaded there yet. If you try to
console.log($('#web-app-data'));
that variable, you can check if jQuery actually found anything. jQuery object should have lenght of (atleast) one if corrensponding element is indeed in DOM atm.

That will work and you use just like it was the full JQuery selector.
var elm = $('#webappData');
if (elm.hasClass('someClass')) elm.removeClass('someClass');
return;

To verify that any item has been selected using Jquery Selectors

I have a situation like this,
Iam trying to select a label using Id selector and sets its value..Due to some reason it doesnt seem to be working
$(document).ready(function () {
$("#Label3").val("hii");
});
How do I verify that $("#Label3") has indeed selected the label.
The label is rendered like this:
<span id="Label3"></span>

Only fields have a value and are therefore accessible with val(). To set the text of a Span you should use html() or text().
$(document).ready(function () {
$("#Label3").html("hii");
});
or
$(document).ready(function () {
$("#Label3").text("hii");
});

You can check the number of elements in the result returned by $("#Label3") by looking at the length:
var label3 = $("#Label3");
if (label3.length == 0) {
// not found
}
The reason why your code doesn't work is that you need to set text not val:
$("#Label3").text("hii");

<span>s don't have values - you probably want $("#Label3").text("hii");.
To answer the question, however, you can check .length - it will return 0 when no elements were found (which is a false value in JavaScript):
var label3 = $("#Label3");
if(label3.length){
label3.text("hii");
}
else{
alert("label wasn't found.");
}
See also:
http://api.jquery.com/text
http://api.jquery.com/length

To verify if a selector has worked I'd normally do -
$("#Label3").length
I'd only use that during debugging though.

Using the console in Safari, Chrome, or Firefox/Firebug:
console.log( $( '#Label3' ) );
Or
console.log( $( '#Label3' ).length );
Also, your element is a span, which does not have a value. Use .text() or .html() instead of .val()

To clarify what others have said, val() in jQuery is for getting the value of input fields.