Develop Reference

javascript disabled attribute not working in angularJS?

I have written the following line to add an disable attribute to an element in angular
angular.element(document.getElementsByClassName("pit")).setAttribute('disabled');
but it is not working and throwing an error:
angular.element(...).setAttribute is not a function

angular.element returns a jQuery/jQuery lite wrapped element, not the raw DOM element.
You can set it using jQuery methods:
angular.element(document.getElementsByClassName("pit")).attr('disabled', true);
This is not really the angular way though. Consider adding a service to provide values to ng-disabled, or directive to manage the disabled state.

angular.element returns a jQuery or jqLite Object, both has an attr() function that you can use instead, so:
instead of:
angular.element(document.getElementsByClassName("pit")).setAttribute('disabled');
you should write:
angular.element(".pit").attr('disabled', 'disabled');

Angular has built in jQuery, so you could just add
$(".pit").attr('disabled', true);

angular.element(document.querySelector(".pit")).setAttribute('disabled',true);

This statement will work only if the element is an input type
angular.element(document.getElementsByClassName("pit")).attr('disabled', true);
Or use ng-disabled directive. this is the best way to disable an element in angular.

How can I select an element using JQuery and modify it's contents?

I have the following structure:
<div class="button">
Photos
</div>
Using JQuery how can I select .button and remove the target="_blank" from the html?
I was able to get to here by following the JQuery docs but i am new and lost.
$('.button').html("Photos");

$(".button a").removeAttr("target");
Although this is easy enough to figure out what this does, the removeAttr() method will remove any/all html attributes that's called from the selector.
Here's the documentation: http://api.jquery.com/removeattr/

Try like this:
I have changed href value for testing.
Live demo: http://jsfiddle.net/pZAdP/8/
$( document ).ready(function() {
$('.button').html("<a href='/go' class='test'>Photos</a>");
});

Problem: You are using double quote for quoting html and tag both use **single quote** for one of them
Solution:
$('.button').html('Photos');
and if you want to remove just a attribute use this
$('.button').find('a').removeAttr('target');

Getting the type of a control using Javascript and JQuery

I am trying to use JQuery to get the type of control and following is the code that I am using.
$('#selCity').attr('type')
where selCity is of type select. When I try the above code it returns as undefined but when I use the alternative code with Javascript, it returns the correct type.
Please look into this fiddle to understand it clearly: http://jsfiddle.net/Ye8e9/
Could someone advice on how I can acheive this correctly using JQuery? Is this an issue with JQuery or am I making a mistake?

Use
$('#selCity').prop('type')
As of jQuery 1.6, the .attr() method returns undefined for attributes
that have not been set. In addition, .attr() should not be used on
plain objects, arrays, the window, or the document. To retrieve and
change DOM properties, use the .prop() method.
Reference
DEMO

if you mean the type of tag, the use this
$("#selCity").get(0).tagName
See your demo here

Use nodeName to get 'type of Tag'. '.type' refers to attribute 'type' which select doesn't have.
document.getElementById('selCity').nodeName

you are getting undefined because there is not type attribute in select.
try this one
$('#selCity')[0].tagName;

jQuery and HTML5 elements

I was wondering whether or not jQuery supports HTML5 elements.
For example, I tried this code but it fails with a rather weird error:
$('<progress value="2">').val();
It says:
TypeError: Object 1 has no method 'replace'
Is jQuery to support HTML5 elements in the future, or am I doing something wrong this way?
EDIT: It does not seem to be the selector: http://jsfiddle.net/z5t3g/

If you have your <progress /> element in the DOM:
<progress value="2" />
You can select it using jQuery, but it seems that (as of version 1.5) it doesn't know to return the value attribute using the .val() method. You need to check the attribute by name:
$('progress').attr('value');

Use a jquery selector for it
$("progress").val();

try this:
$('#progress').val();

You'll want to do this
$('progress[value=="2"]).val();
You can't select using the entire tag with jQuery.

Help me understand whats wrong with my javascript

If I do this-
alert(anchor);
I get this-
"[object HTMLLIElement]"
... ok, yep, it is the element I want. So I want to get that elements ID.
So I test it like this:
alert(anchor.attr("id"));
... but I don't get any alert, nothing. I must not be selecting an element. What am I doing wrong, what don't I understand?

There are two problems:
.attr() is a function jQuery objects have, you have a DOM element (you would need $(anchor) to use jQuery methods against the element).
You don't need it anyway, the .id property will work (and be much faster), like this:
alert(anchor.id);

That's because attr is not a defined method or property on anchor. anchor is a raw HTML element object. It's not a jQuery object (I'm assuming you're using jQuery because you used the attr method).
To get the id, all you have to do is anchor.id. If you really want to use attr, you can do jQuery(anchor).attr("id").

if you are using jquery, then you need this:
alert($(anchor).attr("id"));

The attr() function is part of jQuery, but you're trying to get it from a plain DOM object. You either want to use $(anchor) (to wrap the element in jQuery) or call anchor.getAttribute("id") instead.